@font-face{font-family:SG Constructiva Thai;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/noto-sans-thai-thai-wght-normal-CtQSZ1tK.woff2)format("woff2");unicode-range:U+2D7,U+303,U+331,U+E01-E5B,U+200C-200D,U+25CC}:root{--font-body:Inter, "SG Constructiva Thai", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-display:Inter, "SG Constructiva Thai", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;font-family:var(--font-body);color:#eef2f3;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--bg:#10181e;--panel:#172128;--panel-raised:#1c2830;--panel-soft:#202d35;--line:#dbe7e91b;--line-strong:#dbe7e92b;--text:#eef2f3;--muted:#94a3aa;--faint:#6d7b82;--amber:#e3ad5d;--amber-bright:#f0c071;--teal:#83b9ad;--good:#90c6a6;--danger:#e4a27e;background:#10181e}*{box-sizing:border-box}html{background:var(--bg);min-width:320px}body{min-width:320px;min-height:100vh;margin:0}button,a{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid var(--amber-bright);outline-offset:3px}.app-shell{background:radial-gradient(ellipse at 55% -25%, #516f7321, transparent 49%), var(--bg);min-height:100vh}.topbar{border-bottom:1px solid var(--line);background:#0e161beb;justify-content:space-between;align-items:center;height:70px;padding:0 36px;display:flex}.brand{color:var(--text);align-items:center;gap:12px;text-decoration:none;display:inline-flex}.brand-mark{color:#f3c374;width:37px;height:37px;font-family:var(--font-display);letter-spacing:-.08em;background:linear-gradient(145deg,#e3ad5d29,#e3ad5d0a);border:1px solid #e3ad5d8c;border-radius:9px 9px 9px 3px;place-items:center;font-size:13px;font-weight:800;display:grid}.brand-wordmark{flex-direction:column;gap:3px;display:flex}.brand-wordmark strong{font-family:var(--font-display);letter-spacing:.15em;font-size:13px;font-weight:800}.brand-wordmark small{color:#7e8c91;letter-spacing:.17em;font-size:8px;font-weight:700}.topbar-center{color:#829198;letter-spacing:.18em;align-items:center;gap:9px;font-size:9px;font-weight:700;display:flex}.status-dot,.prototype-pill span,.live-indicator{background:var(--teal);border-radius:50%;width:6px;height:6px;display:inline-block;box-shadow:0 0 11px #83b9ad73}.topbar-actions{align-items:center;gap:20px;display:flex}.prototype-pill{color:#dcb773;letter-spacing:.13em;background:#e3ad5d11;border:1px solid #e3ad5d33;border-radius:5px;align-items:center;gap:7px;height:25px;padding:0 9px;font-size:8px;font-weight:700;display:inline-flex}.prototype-pill span{background:var(--amber);width:5px;height:5px;box-shadow:none}.icon-button,.tool-button,.modal-close{cursor:pointer;background:0 0;border:0}.help-button{color:#a8b2b6;align-items:center;gap:7px;padding:6px 0;font-size:11px;display:inline-flex}.help-button:hover{color:var(--amber-bright)}.avatar{color:#d7e0e1;background:#34424a;border:1px solid #ffffff17;border-radius:50%;place-items:center;width:29px;height:29px;font-size:10px;font-weight:700;display:grid}.language-select{color:#a8b2b6;flex-shrink:0;align-items:center;display:inline-flex;position:relative}.topbar-actions .avatar{flex-shrink:0}.language-select svg{pointer-events:none;position:absolute;inset-inline-start:9px}.language-select select{border:1px solid var(--line-strong);height:29px;color:inherit;font:inherit;cursor:pointer;background:#ffffff08;border-radius:6px;padding-block:0;padding-inline:29px 10px;font-size:11px}.language-select select:hover{color:var(--amber-bright);border-color:#e3ad5d59}.language-select select:focus-visible{outline:2px solid var(--amber-bright);outline-offset:3px}.language-select option{color:#eef2f3;background:#172128}.visually-hidden{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.workbench{max-width:1500px;margin:0 auto;padding:31px 36px 18px}.mission-heading{justify-content:space-between;align-items:end;margin-bottom:23px;display:flex}.eyebrow,.panel-kicker{color:#849198;letter-spacing:.16em;font-size:9px;font-weight:700}.eyebrow{align-items:center;gap:9px;margin-bottom:8px;display:flex}.eyebrow>span:first-child{color:var(--amber)}.eyebrow-divider{color:#4d5b62}.mission-id{color:#a5b1b4;letter-spacing:.11em;background:#ffffff0b;border-radius:3px;margin-inline-start:7px;padding:4px 7px;font-size:8px}.heading-copy h1{font-family:var(--font-display);letter-spacing:-.045em;margin:0;font-size:clamp(25px,2.5vw,34px);font-weight:700;line-height:1.2}.heading-copy p{color:#9aa7ac;margin:7px 0 0;font-size:12px}.heading-meta{gap:8px;padding-bottom:4px;display:flex}.meta-chip{border:1px solid var(--line);color:#a1adb1;letter-spacing:.1em;border-radius:5px;align-items:center;gap:7px;padding:7px 9px;font-size:8px;font-weight:700;display:flex}.meta-chip svg{color:var(--amber)}.duration-icon{color:var(--amber);font-size:15px;line-height:10px}.learning-steps{max-width:635px;margin:0 0 20px;padding:0;list-style:none;display:flex;position:relative}.learning-steps:before{content:"";top:14px;background:#344149;height:1px;position:absolute;inset-inline:19px}.learning-steps li{z-index:1;color:#748289;align-items:center;gap:8px;width:25%;font-size:10px;display:flex;position:relative}.learning-steps li:not(:first-child){justify-content:center}.learning-steps li:last-child{justify-content:end}.step-number{color:#839097;background:#131c22;border:1px solid #39464d;border-radius:50%;place-items:center;width:27px;height:27px;font-size:8px;font-weight:700;display:grid}.step-complete .step-number{color:var(--teal);background:#83b9ad1a;border-color:#83b9ad80}.step-complete>span:last-child{color:#acb9ba}.step-active .step-number{border-color:var(--amber);color:var(--amber-bright);background:#e3ad5d21;box-shadow:0 0 0 4px #e3ad5d0f}.step-active>span:last-child{color:#f0c071;font-weight:700}.workspace-grid{grid-template-columns:minmax(0,1fr) 300px;align-items:start;gap:17px;display:grid}.build-column{flex-direction:column;gap:13px;min-width:0;display:flex}.brief-card,.site-panel,.tool-card,.check-card,.connection-status{border:1px solid var(--line);background:linear-gradient(135deg,#1c2830f5,#161f26fa);border-radius:8px}.brief-card{align-items:center;gap:14px;min-height:91px;padding:15px 18px;display:flex}.brief-symbol{color:#e4b76d;background:#e3ad5d14;border:1px solid #e3ad5d38;border-radius:7px;flex:none;place-items:center;width:42px;height:42px;display:grid}.brief-copy{min-width:0}.brief-copy h2{font-family:var(--font-display);letter-spacing:-.02em;margin:5px 0 4px;font-size:15px}.brief-copy p{color:#9aa7ab;margin:0;font-size:10px;line-height:1.5}.brief-count{border-inline-start:1px solid var(--line);text-align:end;min-width:84px;margin-inline-start:auto;padding-inline-start:15px}.brief-count strong{color:var(--amber-bright);font-family:var(--font-display);font-size:20px;line-height:1;display:block}.brief-count strong span{color:#75848a;font-size:12px;font-weight:500}.brief-count small{color:#78868b;letter-spacing:.16em;margin-top:6px;font-size:7px;font-weight:700;display:block}.site-panel{background:#18232a;overflow:hidden}.site-toolbar{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:8px;height:42px;padding:0 12px 0 15px;display:flex}.site-title,.site-tools{align-items:center;gap:8px;display:flex}.site-title{color:#c5d0d1;letter-spacing:.13em;font-size:8px;font-weight:700}.live-indicator{width:5px;height:5px}.toolbar-slash{color:#4c5a60}.toolbar-muted{color:#77868d}.teaching-tag{color:#9bc2b5;letter-spacing:.11em;background:#83b9ad14;border-radius:4px;align-items:center;gap:5px;padding:5px 7px;font-size:7px;font-weight:700;display:inline-flex}.tool-button{border:1px solid var(--line);color:#95a3a7;border-radius:4px;place-items:center;width:27px;height:27px;display:grid}.tool-button:hover{color:var(--amber-bright);border-color:#e3ad5d80}.scene-wrap{background:#dfe9e5;height:clamp(280px,33vw,390px);min-height:280px;position:relative;overflow:hidden}.bridge-scene{width:100%;height:100%}.bridge-scene canvas{width:100%;height:100%;display:block}.scene-fallback{color:#edf0e9;background:#10181edb;border-radius:5px;padding:9px 11px;font-size:11px;position:absolute;inset:12px 12px auto}.scene-label{color:#344d4b;letter-spacing:.14em;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#f7f9f4c4;border:1px solid #3549472b;border-radius:4px;align-items:center;gap:6px;padding:5px 7px;font-size:7px;font-weight:800;display:flex;position:absolute;top:19px}.scene-label-start{left:20px}.scene-label-end{right:20px}.label-pin{border:1.5px solid #6f9585;border-radius:50%;width:5px;height:5px}.span-dimension{text-align:center;pointer-events:none;border-top:1px solid #3053515c;position:absolute;top:25%;left:31%;right:31%}.span-dimension:before,.span-dimension:after{content:"";border-left:1px solid #30535166;height:7px;position:absolute;top:-4px}.span-dimension:before{left:0}.span-dimension:after{right:0}.span-dimension span{color:#526968;letter-spacing:.11em;background:#ebf2edc2;padding:2px 6px;font-size:7px;font-weight:700;position:relative;top:-9px}.scene-coordinate{color:#526664;letter-spacing:.12em;background:#f1f5eeb3;border-radius:3px;padding:4px 6px;font-size:7px;font-weight:700;position:absolute;bottom:12px;right:14px}.site-footer{border-top:1px solid var(--line);color:#829097;letter-spacing:.11em;align-items:center;gap:16px;height:34px;padding:0 14px;font-size:7px;font-weight:700;display:flex}.site-footer>span{align-items:center;gap:5px;display:flex}.legend-square{border-radius:2px;width:7px;height:7px}.timber-legend{background:#bd8547}.stone-legend{background:#c5c6ba}.site-scale{color:#68777e;margin-inline-start:auto}.connection-status{background:#172128bd;align-items:flex-start;gap:11px;padding:12px 15px;display:flex}.connection-icon{width:28px;height:28px;color:var(--teal);background:#83b9ad13;border:1px solid #83b9ad38;border-radius:50%;flex:none;place-items:center;display:grid}.connection-status strong{color:#dae2e2;margin:1px 0 3px;font-size:10px;display:block}.connection-status p{color:#8f9da2;margin:0;font-size:9px;line-height:1.45}.connection-status.status-pass{border-color:#90c6a647}.status-pass .connection-icon{color:var(--good);background:#90c6a617;border-color:#90c6a65c}.connection-status.status-needs-work{border-color:#e4a27e40}.status-needs-work .connection-icon{color:var(--danger);background:#e4a27e14;border-color:#e4a27e52}.tool-column{flex-direction:column;gap:12px;display:flex}.tool-card{padding:16px}.card-heading{justify-content:space-between;align-items:start;gap:8px;display:flex}.card-heading h2{font-family:var(--font-display);letter-spacing:-.02em;margin:5px 0 0;font-size:15px}.stock-tag{color:#cda760;letter-spacing:.1em;background:#e3ad5d14;border-radius:3px;margin-top:3px;padding:5px 6px;font-size:7px;font-weight:800}.card-description{color:#97a5aa;margin:9px 0 12px;font-size:9px;line-height:1.55}.material-preview{background:linear-gradient(145deg,#24333be6,#18242acc);border:1px solid #e4ece912;border-radius:5px;height:82px;position:relative;overflow:hidden}.material-preview:before{content:"";background:linear-gradient(135deg,#0000 48%,#ffffff09 49%,#0000 50%) 0 0/17px 17px;position:absolute;inset:0}.material-block{background:linear-gradient(110deg,#b4793e,#d69a55 44%,#9c6736);border:1px solid #f8cd878c;border-radius:2px;width:52px;height:14px;position:absolute;transform:skewY(-17deg)rotate(-17deg);box-shadow:0 6px 15px #0000002e}.block-one{top:31px;left:27%}.block-two{opacity:.86;top:39px;left:43%}.block-three{opacity:.7;top:47px;left:59%}.material-bracket{background:#f0c07191;width:1px;height:43px;position:absolute;top:23px;right:22%}.material-bracket:before,.material-bracket:after{content:"";border-top:1px solid #f0c07191;width:7px;position:absolute;left:-3px}.material-bracket:before{top:0}.material-bracket:after{bottom:0}.material-label{color:#d5dedd;align-items:center;gap:7px;margin:9px 0 13px;font-size:9px;font-weight:600;display:flex}.material-swatch{background:#be8648;border-radius:2px;width:9px;height:9px;box-shadow:inset 0 0 0 1px #ffffff2e}.material-note{color:#728189;letter-spacing:.11em;margin-inline-start:auto;font-size:7px}.segment-counter{border-top:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:13px;padding-top:11px;display:flex}.segment-counter>div:first-child{color:#849399;align-items:baseline;gap:8px;font-size:9px;display:flex}.segment-counter strong{color:#e5eaea;font-size:12px}.segment-counter small{color:#839197;font-size:9px;font-weight:500}.segment-meter{gap:3px;display:flex}.segment-meter span{background:#344149;border-radius:2px;width:18px;height:5px}.segment-meter span.meter-filled{background:#d8a558;box-shadow:0 0 7px #d8a55840}.build-actions{grid-template-columns:minmax(0,1fr) 76px;gap:7px;display:grid}.button{cursor:pointer;border:1px solid #0000;border-radius:5px;justify-content:center;align-items:center;gap:8px;min-height:36px;padding:0 11px;font-size:9px;font-weight:700;transition:transform .16s,border-color .16s,background .16s,opacity .16s;display:inline-flex}.button:not(:disabled):hover{transform:translateY(-1px)}.button:disabled{cursor:not-allowed;opacity:.42}.button-primary{color:#2a271e;background:linear-gradient(120deg,#d6a456,#e4b967);border-color:#e3ad5d52;box-shadow:0 4px 12px #aa793124}.button-primary:not(:disabled):hover{background:linear-gradient(120deg,#e1b46a,#f0c87d)}.button-secondary{border-color:var(--line-strong);color:#b6c1c2;background:#202b32}.button-secondary:not(:disabled):hover{color:var(--amber-bright);border-color:#e3ad5d5c}.concept-card{padding-top:14px}.concept-heading{align-items:center;gap:8px;display:flex}.concept-icon{color:#e0b36b;background:#e3ad5d1a;border-radius:6px;place-items:center;width:27px;height:27px;display:grid}.concept-card h2{font-family:var(--font-display);letter-spacing:-.02em;margin:10px 0 6px;font-size:13px}.concept-card>p{color:#98a5aa;margin:0;font-size:9px;line-height:1.65}.concept-divider{background:var(--line);height:1px;margin:12px 0 8px}.concept-foot{color:#859398;letter-spacing:.13em;justify-content:space-between;align-items:center;font-size:7px;font-weight:700;display:flex}.concept-foot svg{color:var(--amber)}.check-card{background:linear-gradient(145deg,#1f3033eb,#182429f5);border-color:#83b9ad29;padding:14px 15px 12px}.check-topline{align-items:center;gap:9px;display:flex}.check-icon{color:#8cc0b1;background:#83b9ad14;border:1px solid #83b9ad47;border-radius:50%;place-items:center;width:28px;height:28px;display:grid}.check-topline strong{color:#e2eae8;margin-top:4px;font-size:10px;display:block}.check-card>p{color:#97a8a8;margin:9px 0 10px;font-size:9px;line-height:1.5}.button-test{color:#acd4c7;background:#83b9ad1f;border-color:#83b9ad42;justify-content:space-between;width:100%;min-height:36px}.button-test:hover{background:#83b9ad30;border-color:#83b9ad8c}.rule-note{color:#718187;text-align:center;letter-spacing:.05em;margin-top:8px;font-size:7px;display:block}.page-footer{color:#6e7e84;letter-spacing:.12em;border-top:1px solid #dbe7e912;justify-content:space-between;align-items:center;gap:12px;margin-top:17px;padding-top:12px;font-size:7px;font-weight:700;display:flex}.page-footer>span{align-items:center;gap:6px;display:flex}.page-footer>span:last-child{color:#849196;letter-spacing:.02em;font-size:8px;font-weight:500}.page-footer svg{color:#8eb8a9}.footer-mark{color:var(--amber);font-family:var(--font-display);letter-spacing:-.09em}.modal-backdrop{z-index:10;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#050a0dba;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.guide-modal{background:linear-gradient(145deg,#202e35,#151f25);border:1px solid #dbe7e929;border-radius:10px;width:min(100%,420px);padding:27px;position:relative;box-shadow:0 24px 90px #0000007a}.modal-close{top:12px;color:#a7b3b6;width:30px;height:30px;font-size:22px;position:absolute;inset-inline-end:14px}.modal-close:hover{color:var(--amber-bright)}.modal-icon{width:42px;height:42px;color:var(--amber);background:#e3ad5d17;border:1px solid #e3ad5d3d;border-radius:8px;place-items:center;margin-bottom:15px;display:grid}.guide-modal h2{font-family:var(--font-display);letter-spacing:-.04em;margin:8px 0;font-size:21px}.guide-modal>p{color:#a3afb2;margin:0;font-size:12px;line-height:1.7}.guide-note{color:#a8c5bb;background:#83b9ad12;border:1px solid #83b9ad2b;border-radius:5px;align-items:flex-start;gap:8px;margin:17px 0;padding:10px 11px;font-size:9px;line-height:1.55;display:flex}.guide-note svg{flex:none;margin-top:1px}.modal-done{width:100%}@media (width>=1300px){.workspace-grid{grid-template-columns:minmax(0,1fr) 315px;gap:19px}.workbench{padding-top:35px}.brief-card{min-height:96px}}@media (width<=920px){.topbar{padding:0 22px}.workbench{padding:27px 22px 18px}.workspace-grid{grid-template-columns:minmax(0,1fr) 275px;gap:12px}.tool-card{padding:13px}.build-actions{grid-template-columns:minmax(0,1fr) 62px}.topbar-center{display:none}.site-footer{gap:10px}}@media (width<=720px){.topbar{height:62px;padding:0 15px}.brand-mark{width:33px;height:33px}.brand-wordmark strong{font-size:11px}.brand-wordmark small{font-size:7px}.topbar-actions{gap:10px}.prototype-pill{padding:0 7px;font-size:7px}.help-button{gap:0;font-size:0}.help-button svg{width:18px;height:18px}.avatar{width:26px;height:26px}.workbench{padding:24px 15px 14px}.mission-heading{flex-direction:column;align-items:flex-start;gap:13px;margin-bottom:18px}.heading-meta{padding:0}.learning-steps{width:100%;margin-bottom:15px}.learning-steps li{flex-direction:column;gap:5px;font-size:8px}.learning-steps li:not(:first-child),.learning-steps li:last-child{justify-content:flex-start}.learning-steps:before{top:13px;inset-inline:13%}.step-number{width:25px;height:25px}.workspace-grid{grid-template-columns:minmax(0,1fr);gap:12px}.scene-wrap{height:310px;min-height:260px}.tool-column{grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;display:grid}.build-card{grid-column:1/-1}.concept-card,.check-card{min-height:165px}.page-footer{flex-direction:column;align-items:flex-start}}@media (width<=440px){.topbar{padding:0 11px}.brand{gap:8px}.brand-mark{width:30px;height:30px}.brand-wordmark strong{letter-spacing:.12em;font-size:10px}.brand-wordmark small{letter-spacing:.11em}.prototype-pill{gap:5px;font-size:6px}.prototype-pill span{width:4px;height:4px}.topbar-actions{gap:8px}.workbench{padding-inline:11px}.heading-copy h1{font-size:25px}.heading-copy p{max-width:310px;font-size:11px;line-height:1.5}.brief-card{align-items:flex-start;gap:10px;padding:12px}.brief-symbol{width:35px;height:35px}.brief-symbol svg{width:19px;height:19px}.brief-copy h2{font-size:13px}.brief-copy p{max-width:210px;font-size:9px}.brief-count{min-width:58px;padding-inline-start:9px}.brief-count strong{font-size:17px}.scene-wrap{height:270px;min-height:240px}.scene-label{font-size:6px;top:12px}.scene-label-start{left:10px}.scene-label-end{right:10px}.span-dimension{top:24%;left:26%;right:26%}.site-footer{flex-wrap:wrap;height:auto;min-height:34px;padding:8px 10px;font-size:6px}.site-scale{margin-inline-start:auto}.tool-column{grid-template-columns:minmax(0,1fr)}.build-card{grid-column:auto}.concept-card,.check-card{min-height:auto}.site-title{gap:6px;font-size:7px}.teaching-tag{padding:5px;font-size:6px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.build-actions .button{white-space:nowrap}html:lang(th) body :not(.brand-mark,.brand-wordmark strong,.footer-mark){letter-spacing:normal}@media (width<=720px){.language-select svg{inset-inline-start:50%;transform:translate(-50%)}.language-select select{color:#0000;width:29px;padding:0}.language-select select:hover{color:#0000}}.position-picker{grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:10px 0 6px;display:grid}.position-option{color:#c6d0d0;cursor:pointer;background:#202b32;border:1px solid #dbe7e921;border-radius:5px;flex-direction:column;justify-content:center;align-items:center;gap:3px;min-width:0;min-height:43px;padding:4px 2px;display:flex}.position-option:hover:not(:disabled){background:#e3ad5d12;border-color:#e3ad5d7a}.position-option.position-selected{border-color:var(--amber);color:#f0c071;background:#e3ad5d21;box-shadow:0 0 0 2px #e3ad5d14}.position-option.position-occupied{color:#a9cbbf;cursor:not-allowed;opacity:.82;background:#83b9ad17;border-color:#83b9ad47}.position-option:disabled{opacity:.82}.position-option:focus-visible{outline:2px solid var(--amber-bright);outline-offset:2px}.position-number{font-size:10px;font-weight:800;line-height:1}.position-state{color:#829197;letter-spacing:.06em;font-size:6px;font-weight:800}.position-selected .position-state{color:#e8bb72}.position-occupied .position-state{color:#9cc7b7}.position-hint{color:#98a7aa;min-height:26px;margin:0 0 10px;font-size:8px;line-height:1.45}