:root{--text:#6b6375;--text-h:#08060d;--bg:#fff;--border:#e5e4e7;--code-bg:#f4f3ec;--accent:#aa3bff;--accent-bg:#aa3bff1a;--accent-border:#aa3bff80;--social-bg:#f4f3ec80;--shadow:#0000001a 0 10px 15px -3px, #0000000d 0 4px 6px -2px;--sans:system-ui, "Segoe UI", Roboto, sans-serif;--heading:system-ui, "Segoe UI", Roboto, sans-serif;--mono:ui-monospace, Consolas, monospace;font:18px/145% var(--sans);letter-spacing:.18px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}@media (width<=1024px){:root{font-size:16px}}@media (prefers-color-scheme:dark){:root{--text:#9ca3af;--text-h:#f3f4f6;--bg:#16171d;--border:#2e303a;--code-bg:#1f2028;--accent:#c084fc;--accent-bg:#c084fc26;--accent-border:#c084fc80;--social-bg:#2f303a80;--shadow:#0006 0 10px 15px -3px, #00000040 0 4px 6px -2px}#social .button-icon{filter:invert()brightness(2)}}body{margin:0}#root{text-align:center;border-inline:1px solid var(--border);box-sizing:border-box;flex-direction:column;width:1126px;max-width:100%;min-height:100svh;margin:0 auto;display:flex}h1,h2{font-family:var(--heading);color:var(--text-h);font-weight:500}h1{letter-spacing:-1.68px;margin:32px 0;font-size:56px}@media (width<=1024px){h1{margin:20px 0;font-size:36px}}h2{letter-spacing:-.24px;margin:0 0 8px;font-size:24px;line-height:118%}@media (width<=1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);color:var(--text-h);border-radius:4px;display:inline-flex}code{background:var(--code-bg);padding:4px 8px;font-size:15px;line-height:135%}*{box-sizing:border-box}body{color:#eef4ff;background:radial-gradient(circle at 15% 45%,#5d3eaa2e,#0000 32%),radial-gradient(circle at 90% 90%,#6c41be38,#0000 30%),linear-gradient(135deg,#0b111b 0%,#111827 55%,#0b1220 100%);min-width:320px;min-height:100vh;margin:0;font-family:Arial,Helvetica,sans-serif}#root{min-height:100vh}.app{min-height:100vh;padding:70px 24px 60px}header{text-align:center;margin-bottom:45px}header h1{background:linear-gradient(90deg,#74c8ff,#b984ff,#e77ae9);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;padding-top:4px;font-size:3.5rem;font-weight:700;line-height:1.2}header p{color:#c4d0e3;margin:8px 0 0;font-size:1.35rem}.learning-grid{grid-template-columns:repeat(4,1fr);gap:20px;width:min(1200px,100%);margin:0 auto;display:grid}.learning-card{text-align:left;color:#eef4ff;cursor:pointer;background:linear-gradient(145deg,#1e293beb,#111827f0);border:1px solid #818cf84d;border-radius:20px;flex-direction:column;justify-content:center;align-items:flex-start;min-height:210px;padding:26px;transition:transform .2s,border-color .2s,box-shadow .2s;display:flex;box-shadow:0 18px 40px #00000040,inset 0 1px #ffffff0a}.learning-card:hover{border-color:#8b5cf6b3;transform:translateY(-5px);box-shadow:0 22px 50px #00000059,0 0 25px #6366f11f}.learning-card:focus-visible{outline-offset:4px;outline:3px solid #74c8ff}.learning-card .icon{margin-bottom:14px;font-size:2.4rem;display:block}.learning-card h2{color:#f3f6fc;margin:0 0 8px;font-size:1.35rem}.learning-card p{color:#b8c4d8;margin:0;font-size:.95rem;line-height:1.5}@media (width<=900px){.learning-grid{grid-template-columns:repeat(2,1fr);gap:18px}.learning-card{min-height:190px}}@media (width<=600px){.app{padding:30px 14px 40px}header{margin-bottom:28px}header h1{font-size:2rem}header p{font-size:1rem}.learning-grid{grid-template-columns:repeat(2,1fr);gap:12px}.learning-card{border-radius:16px;min-height:155px;padding:16px}.learning-card .icon{margin-bottom:10px;font-size:2rem}.learning-card h2{margin-bottom:6px;font-size:1.05rem}.learning-card p{font-size:.82rem;line-height:1.35}}@media (width<=360px){.learning-grid{grid-template-columns:1fr}.learning-card{min-height:135px}}.search-section{width:min(700px,100%);margin:0 auto 50px}.search-label{color:#c4d0e3;margin-bottom:8px;font-size:.95rem;font-weight:600;display:block}.search-box{background:linear-gradient(145deg,#1e293bf0,#111827f5);border:1px solid #818cf859;border-radius:16px;align-items:center;padding:0 18px;display:flex;box-shadow:0 12px 30px #00000038,inset 0 1px #ffffff0a}.search-icon{margin-right:12px;font-size:1.15rem}.search-box input{color:#eef4ff;background:0 0;border:none;outline:none;width:100%;min-height:56px;padding:0;font-size:1rem}.search-box input::placeholder{color:#7f8da3}.search-box:focus-within{border-color:#74c8ff;box-shadow:0 0 0 3px #74c8ff1f,0 12px 30px #00000040}.no-results{text-align:center;background:#1118278c;border:1px solid #818cf833;border-radius:18px;padding:45px 20px}.no-results h3{color:#f3f6fc;margin:0 0 8px}.no-results p{color:#8fa0b8;margin:0}@media (width<=600px){.search-section{margin-bottom:35px}.search-box{border-radius:14px;padding:0 14px}.search-box input{min-height:50px;font-size:.9rem}}.most-used-grid{grid-template-columns:repeat(2,minmax(220px,280px));justify-content:center}@media (width<=600px){.most-used-grid{grid-template-columns:repeat(2,1fr);gap:12px}}.word-page{width:min(900px,100%);margin:0 auto}.back-button{color:#9fd4ff;cursor:pointer;background:#1e293bd9;border:1px solid #74c8ff59;border-radius:10px;margin-bottom:28px;padding:10px 16px;font-size:.95rem;transition:background .2s,border-color .2s,transform .2s}.back-button:hover{background:#74c8ff1a;border-color:#74c8ff;transform:translateY(-1px)}.word-header{text-align:center;margin-bottom:34px}.word-header .module-icon{margin-bottom:8px;font-size:2.8rem}.word-header h1{background:linear-gradient(90deg,#74c8ff,#b984ff,#e77ae9);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:3rem;font-weight:700;line-height:1.2}.word-header p{color:#c4d0e3;max-width:680px;margin:10px auto 0;font-size:1.05rem;line-height:1.5}.practice-card{background:linear-gradient(145deg,#1e293bf0,#111827f5);border:1px solid #818cf859;border-radius:20px;width:min(680px,100%);margin:0 auto;padding:32px;box-shadow:0 18px 40px #00000040,inset 0 1px #ffffff0a}.practice-label{color:#b984ff;text-align:center;letter-spacing:.14em;margin-bottom:14px;font-size:.78rem;font-weight:700}.practice-card h2{color:#f3f6fc;text-align:center;max-width:560px;margin:0 auto 24px;font-size:1.55rem;line-height:1.4}.word-visual{background:radial-gradient(circle,#74c8ff21,#0000 60%),#0b111bb8;border:1px solid #818cf838;border-radius:16px;width:min(480px,100%);margin:0 auto 26px;overflow:hidden}.word-visual img{object-fit:contain;width:100%;max-width:320px;max-height:220px;margin:0 auto;display:block}.visual-placeholder{justify-content:center;align-items:center;min-height:190px;font-size:4.5rem;display:flex}.answer-label{color:#d9e3f1;margin-bottom:9px;font-size:.95rem;font-weight:600;display:block}.practice-answer{color:#eef4ff;background:#090f1acc;border:1px solid #818cf859;border-radius:12px;width:100%;min-height:54px;padding:0 16px;font-size:1rem}.practice-answer::placeholder{color:#7f8da3}.practice-answer:focus{border-color:#74c8ff;outline:none;box-shadow:0 0 0 3px #74c8ff1f}.primary-button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#5f95ee,#8b6bea);border:none;border-radius:11px;width:100%;min-height:50px;margin-top:14px;padding:0 20px;font-size:1rem;font-weight:700;transition:transform .2s,box-shadow .2s}.primary-button:hover{transform:translateY(-2px);box-shadow:0 10px 25px #6366f13d}.practice-tools{grid-template-columns:1fr 1fr;gap:10px;margin-top:12px;display:grid}.secondary-button{color:#c7d2e4;cursor:pointer;background:#1e293beb;border:1px solid #818cf84d;border-radius:10px;min-height:46px;padding:0 16px;font-size:.95rem;transition:background .2s,border-color .2s,transform .2s}.secondary-button:hover{background:#2c374cf5;border-color:#8b5cf6a6;transform:translateY(-1px)}.word-bottom-nav{background:#111827d1;border:1px solid #818cf833;border-radius:14px;grid-template-columns:1fr 1.35fr 1fr;gap:7px;width:min(680px,100%);margin:18px auto 0;padding:8px;display:grid;box-shadow:0 12px 30px #0000002e}.word-bottom-nav button{color:#aebbd0;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:9px;min-height:44px;padding:8px 10px;font-size:.92rem;transition:background .2s,color .2s,border-color .2s}.word-bottom-nav button:hover{color:#fff;background:#818cf81a}.word-bottom-nav button.active{color:#d1c2ff;background:#8b5cf629;border-color:#b984ff6b}.word-page button:focus-visible{outline-offset:3px;outline:3px solid #74c8ff}.feedback-message{border-radius:10px;margin:14px 0 0;padding:12px 14px;font-size:.95rem;font-weight:600}.feedback-message.correct{color:#9ef0b5;background:#22c55e1f;border:1px solid #22c55e59}.feedback-message.incorrect{color:#ffb4b4;background:#f871711a;border:1px solid #f871714d}.feedback-message.revealed{color:#a9dbff;background:#74c8ff1a;border:1px solid #74c8ff4d}.rating-section{border-top:1px solid #818cf838;margin-top:22px;padding-top:20px}.rating-title{color:#d9e3f1;text-align:center;margin:0 0 12px;font-size:.95rem;font-weight:600}.rating-buttons{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.rating-button{cursor:pointer;background:#1e293be6;border-radius:11px;flex-direction:column;justify-content:center;align-items:center;min-height:66px;padding:10px 8px;transition:transform .2s,background .2s,border-color .2s;display:flex}.rating-button strong{font-size:.98rem}.rating-button span{opacity:.8;margin-top:4px;font-size:.76rem}.rating-button.again{color:#ffb4b4;border:1px solid #f8717159}.rating-button.again:hover{background:#f871711a;border-color:#f87171b3;transform:translateY(-2px)}.rating-button.hard{color:#f6d58a;border:1px solid #f5be4c59}.rating-button.hard:hover{background:#f5be4c1a;border-color:#f5be4cb3;transform:translateY(-2px)}.rating-button.got-it{color:#9ef0b5;border:1px solid #22c55e59}.rating-button.got-it:hover{background:#22c55e1a;border-color:#22c55eb3;transform:translateY(-2px)}.rating-confirmation{color:#aebbd0;text-align:center;margin:12px 0 0;font-size:.85rem}.add-word-card h2{margin-bottom:28px}.add-word-form{flex-direction:column;gap:18px;display:flex}.add-word-form label{color:#d9e3f1;flex-direction:column;gap:8px;font-size:.95rem;font-weight:600;display:flex}.word-textarea{resize:vertical;color:#eef4ff;background:#090f1acc;border:1px solid #818cf859;border-radius:12px;width:100%;min-height:110px;padding:14px 16px;font-family:inherit;font-size:1rem;line-height:1.5}.word-textarea::placeholder{color:#7f8da3}.word-textarea:focus{border-color:#74c8ff;outline:none;box-shadow:0 0 0 3px #74c8ff1f}.save-message{text-align:center;color:#9ef0b5;background:#22c55e1a;border:1px solid #22c55e4d;border-radius:10px;margin:0;padding:12px 14px;font-size:.92rem}.word-image-field{margin-top:6px}.word-image-field>label{color:#d9e3f1;text-align:center;margin-bottom:10px;font-size:.95rem;font-weight:600;display:block}.word-image-field input[type=file]{color:#c4d0e3;width:100%;display:block}.word-image-preview{object-fit:contain;border:1px solid #818cf859;border-radius:12px;width:100%;max-width:450px;max-height:300px;margin:18px auto 0;display:block}.my-words-list{flex-direction:column;gap:20px;display:flex}.my-word-card{background:#090f1ab8;border:1px solid #818cf84d;border-radius:14px;width:100%;padding:22px}.my-word-title{color:#f3f6fc;text-align:center;margin:0 0 20px;font-size:1.35rem;line-height:1.3}.my-word-content{grid-template-columns:minmax(180px,280px) minmax(0,1fr);align-items:start;gap:24px;display:grid}.my-word-image-container{justify-content:center;align-items:flex-start;width:100%;display:flex}.my-word-image{object-fit:contain;border:1px solid #818cf840;border-radius:12px;width:100%;max-width:280px;height:auto;max-height:280px;display:block}.my-word-details{text-align:left;width:100%}.my-word-details p{color:#c4d0e3;margin:0 0 10px;font-size:.95rem;line-height:1.5}.my-word-details strong{color:#f3f6fc}.my-word-hints{color:#c4d0e3;margin-top:18px}.my-word-hints>strong{color:#f3f6fc;margin-bottom:8px;display:block}.my-word-hints p{color:#c4d0e3;margin:5px 0}.empty-words-message{color:#aebbd0;text-align:center;margin:0;line-height:1.5}@media (width<=600px){.word-header{margin-bottom:26px}.word-header .module-icon{font-size:2.3rem}.word-header h1{font-size:2rem}.word-header p{font-size:.92rem}.practice-card{border-radius:17px;padding:22px 18px}.practice-card h2{font-size:1.3rem}.visual-placeholder{min-height:150px;font-size:3.6rem}.practice-tools,.rating-buttons,.word-bottom-nav{grid-template-columns:1fr}.my-word-card{padding:16px}.my-word-title{margin-bottom:16px;font-size:1.2rem}.my-word-content{grid-template-columns:1fr;gap:18px}.my-word-image-container{width:100%;margin:0 auto}.my-word-image{width:auto;max-width:100%;max-height:220px;margin:0 auto}.my-word-details{width:100%}}.import-export-buttons{justify-content:center;gap:10px;display:flex}.import-export-buttons .secondary-button{box-sizing:border-box;cursor:pointer;justify-content:center;align-items:center;width:120px;min-width:120px;height:48px;display:inline-flex}.word-header-row{position:relative}.word-header-row .back-button{z-index:2;width:auto;position:absolute;top:20px;left:0}@media (width<=600px){.word-header-row .back-button{padding:8px 12px;font-size:.9rem;top:8px;left:0}.word-header{padding-top:0}.word-header p{margin-bottom:12px}}.save-confirmation{text-align:center;background:#22c55e1f;border:1px solid #22c55e59;border-radius:8px;margin-top:10px;padding:10px 12px;font-weight:600}.measure-page{width:min(900px,100%);margin:0 auto}.measure-header-row{position:relative}.measure-header{text-align:center;margin-bottom:34px}.measure-module-icon{margin-bottom:8px;font-size:2.8rem}.measure-header h1{background:linear-gradient(90deg,#74c8ff,#b984ff,#e77ae9);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:3rem;font-weight:700}.measure-back-button{color:#9fd4ff;cursor:pointer;background:#1e293bd9;border:1px solid #74c8ff59;border-radius:10px;padding:10px 16px;position:absolute;top:20px;left:0}.measure-card,.penny-calibration{background:linear-gradient(145deg,#1e293bf0,#111827f5);border:1px solid #818cf859;border-radius:20px;width:min(680px,100%);margin:0 auto 22px;padding:32px;box-shadow:0 18px 40px #00000040}.penny-calibration{grid-template-columns:minmax(150px,220px) minmax(0,1fr);align-items:center;gap:32px;display:grid}.penny-side{flex-direction:column;justify-content:center;align-items:center;display:flex}.penny-visual{color:#5b2c17;background:radial-gradient(circle at 35% 30%,#e7a469,#bc6b37 55%,#7b3e20);border:2px solid #ffce99cc;border-radius:50%;flex:none;place-items:center;font-weight:800;display:grid;box-shadow:inset 0 0 0 3px #5e2d1333,0 8px 20px #0000004d}.penny-caption{color:#c4d0e3;text-align:center;flex-direction:column;gap:3px;margin-top:12px;font-size:.85rem;display:flex}.penny-caption strong{color:#f3f6fc}.penny-controls h2{color:#f3f6fc;margin:0 0 10px;font-size:1.4rem}.penny-controls p{color:#c4d0e3;margin:0 0 18px;line-height:1.5}.measure-label{color:#b984ff;letter-spacing:.14em;margin-bottom:12px;font-size:.78rem;font-weight:700}.measure-card>h2{color:#f3f6fc;text-align:center;margin:0 0 12px;font-size:1.55rem}.measure-description{color:#aebbd0;text-align:center;max-width:520px;margin:0 auto 24px;line-height:1.5}.measure-size-controls{align-items:center;gap:14px;display:flex}.measure-size-button{color:#fff;cursor:pointer;background:#1e293beb;border:1px solid #818cf859;border-radius:50%;width:50px;height:50px;font-size:1.6rem}.measure-primary-button{color:#fff;cursor:pointer;background:linear-gradient(90deg,#5f95ee,#8b6bea);border:none;border-radius:11px;width:100%;min-height:48px;margin-top:18px;font-weight:700}.calibrated-row{color:#9ef0b5;background:#22c55e1a;border:1px solid #22c55e4d;border-radius:10px;justify-content:space-between;align-items:center;gap:10px;margin-top:18px;padding:12px 14px;display:flex}.calibrated-row button{color:#9fd4ff;cursor:pointer;background:0 0;border:none}.measure-category-grid{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:24px;display:grid}.measure-category-grid button{color:#c4d0e3;cursor:pointer;background:#090f1ab8;border:1px solid #818cf840;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:100px;display:flex}.measure-category-grid button span{font-size:2rem}.measure-category-grid button.active{color:#fff;background:#8b5cf629;border-color:#b984ff8c}.diameter-board{grid-template-columns:repeat(4,1fr);gap:16px;margin-top:26px;display:grid}.diameter-item{color:#c4d0e3;text-align:center;flex-direction:column;align-items:center;gap:5px;display:flex}.diameter-visual-area{justify-content:center;align-items:center;height:85px;display:flex}.diameter-circle{background:linear-gradient(145deg,#d2d6df,#777f8e);border:1px solid #eff3f9;border-radius:50%;flex:none}.diameter-item strong{color:#f3f6fc}.diameter-item span{font-size:.8rem}.measure-divider{background:#818cf838;height:1px;margin:32px 0}.length-board{flex-direction:column;gap:22px;margin-top:26px;display:flex}.length-item{overflow-x:auto}.length-label{color:#c4d0e3;margin-bottom:7px;font-size:.85rem}.actual-screw{align-items:center;min-width:max-content;height:28px;display:flex}.actual-screw-head{background:linear-gradient(145deg,#d7dbe2,#7f8794);border-radius:50%;flex:0 0 18px;width:18px;height:18px;position:relative}.actual-screw-head span{background:#454d5c;height:2px;position:absolute;top:8px;left:4px;right:4px}.actual-screw-shaft{background:repeating-linear-gradient(120deg,#c6cbd3 0 4px,#767e8b 4px 6px);flex:1;height:7px}.actual-screw-tip{clip-path:polygon(0 0,100% 50%,0 100%);background:#999faa;width:10px;height:7px}.actual-nail{align-items:center;min-width:max-content;display:flex}.nail-head{background:#c4c9d1;border-radius:2px;width:5px;height:18px}.nail-body{background:linear-gradient(#d7dbe1,#858c98);flex:1;height:4px}.nail-tip{clip-path:polygon(0 0,100% 50%,0 100%);background:#9fa5af;width:10px;height:8px}.drill-board{grid-template-columns:repeat(6,1fr);gap:14px;margin-top:26px;display:grid}.drill-item{text-align:center;flex-direction:column;align-items:center;gap:6px;display:flex}.drill-visual-area{justify-content:center;align-items:flex-end;height:130px;display:flex}.drill-bit{background:repeating-linear-gradient(135deg,#d4d8df 0 5px,#737b88 5px 9px);border-radius:3px 3px 0 0;min-width:3px;height:110px}.drill-item strong{color:#f3f6fc}.drill-item span{color:#9daabd;font-size:.75rem}.reference-guide-tabs{grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px;display:grid}.reference-guide-tabs button{color:#c4d0e3;cursor:pointer;background:#090f1ab8;border:1px solid #818cf840;border-radius:11px;min-height:48px;padding:8px 12px;font-weight:600}.reference-guide-tabs button.active{color:#fff;background:#8b5cf629;border-color:#b984ff8c}.reference-scale-message{color:#aebbd0;text-align:center;margin:16px 0 0;font-size:.85rem;line-height:1.5}.reference-guide-viewport{overscroll-behavior:contain;scrollbar-width:thin;cursor:grab;background:#0b111b;border:1px solid #818cf859;border-radius:14px;width:100%;height:620px;margin-top:20px;overflow:auto}.reference-guide-viewport:active{cursor:grabbing}.reference-guide-canvas{width:max-content;min-width:100%;position:relative}.reference-guide-image{-webkit-user-select:none;user-select:none;-webkit-user-drag:none;pointer-events:none;max-width:none;height:auto;display:block}.measure-page button:focus-visible{outline-offset:3px;outline:3px solid #74c8ff}@media (width<=600px){.measure-header h1{font-size:2rem}.measure-module-icon{font-size:2.3rem}.measure-back-button{padding:8px 12px;top:8px}.measure-card,.penny-calibration{border-radius:17px;padding:22px 18px}.penny-calibration{grid-template-columns:1fr}.measure-category-grid,.diameter-board{grid-template-columns:repeat(2,1fr)}.drill-board{grid-template-columns:repeat(3,1fr)}.reference-guide-viewport{height:500px}.reference-guide-tabs{grid-template-columns:1fr}}