@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;450;500;550;600;650;700&display=swap');
.settings-nav{display:flex;align-items:center;flex-shrink:0;border-bottom:1px solid #e4e9ed;background:#fcfdfe;height:39px;padding:0 22px;gap:25px}.settings-nav button{font-size:15px;display:flex;align-items:center;gap:6px;color:#648294;padding:5px 0}.settings-nav button>span:not([data-icon]){color:#a3b1ba;font-size:12px;margin-right:2px}.settings-nav svg{width:10px;height:10px}.settings-nav button:hover{color:#246e94}
:root{font-family:'Noto Sans JP',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;color:#263a48;background:#f5f7f8;font-synthesis:none;font-size:18px;--navy:#142c3f;--teal:#328b91;--muted:#8a969e;--border:#e4e9ed;--blue:#367daf}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.4}button{color:inherit}button:focus-visible,a:focus-visible{outline:2px solid #429fac;outline-offset:3px}input:focus,select:focus{outline:2px solid #61a4b455;outline-offset:0;border-color:#5294a3!important}button svg,[data-icon] svg{width:17px;height:17px;display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}button{border:0;background:none}a{color:inherit;text-decoration:none}.app-header{height:76px;background:var(--navy);color:#eff6fa;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:13px;align-items:center;flex-shrink:0}.brand-icon{width:37px;height:42px;display:grid;place-items:center;color:#8ecbd1}.brand-icon svg{width:36px;height:42px;stroke-width:1.5}.brand strong{font-size:21px;letter-spacing:1.8px;font-weight:650;display:block}.brand strong b{font-weight:400;color:#a8c1cd}.brand small{display:block;font-size:15px;letter-spacing:2.5px;color:#b2c0ca;margin-top:4px}.project-top{display:flex;align-items:center;gap:10px;font-size:18px;color:#d5e0e7}.project-dot{height:6px;width:6px;border-radius:50%;background:#7c9eac}.version-chip{font-size:12px;letter-spacing:1px;color:#9db7c5;border:1px solid #3d5363;padding:3px 6px;border-radius:3px;margin-left:4px}.header-actions{display:flex;gap:8px;align-items:center}.button{display:inline-flex;gap:8px;align-items:center;justify-content:center;border:1px solid #dbe2e6;border-radius:5px;padding:10px 15px;background:#fff;font-weight:500;white-space:nowrap}.header-quiet{border:1px solid transparent;background:transparent;color:#d5e1e7;font-size:16.5px}.header-quiet:hover{background:#ffffff0d}.export-button{background:#e0eff0;border-color:#e0eff0;color:#183d49;font-size:16.5px;padding:10px 14px;margin-left:5px}.export-button [data-icon=chevron] svg{width:13px}.export-button:hover{background:white}.export-wrap{position:relative}.export-menu{position:absolute;right:0;top:48px;width:230px;background:white;padding:6px;border:1px solid var(--border);border-radius:8px;box-shadow:0 12px 40px #142c3f22;z-index:50;color:#314653}.export-menu button{text-align:left;width:100%;padding:12px;border-radius:5px}.export-menu button:hover{background:#eef5f8}.export-menu strong{display:block;font-size:18px;font-weight:500}.export-menu b{font-size:15px;float:right;color:#69909f}.export-menu small{display:block;color:#8b969d;margin-top:5px;font-size:15px}.workspace-bar{height:44px;display:flex;align-items:center;justify-content:space-between;background:#fff;padding:0 28px;border-bottom:1px solid var(--border);font-size:15px;letter-spacing:.25px}.workspace-bar>div{display:flex;align-items:center;gap:10px}.workspace-mark{width:7px;height:7px;background:#577b91;border-radius:1px}.slash{color:#b6c0c6;margin:0 4px}.muted{color:#939ea5}.status-dot{display:inline-block;width:5px;height:5px;border-radius:50%;background:#66a58e;margin-right:6px}#save-status{color:#8b989e;font-size:15px}.workspace{display:grid;grid-template-columns:450px minmax(0,1fr);height:calc(100dvh - 120px);min-height:590px}.settings{border-right:1px solid #dde4e9;background:white;display:flex;flex-direction:column;overflow:hidden;z-index:5}.settings-scroll{overflow:auto;scrollbar-width:thin;scrollbar-color:#d8e0e5 transparent;flex:1}.setting-section{padding:24px 24px 25px;border-bottom:1px solid var(--border)}.section-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.section-heading h1,.section-heading h2{font-size:19.5px;font-weight:650;display:flex;align-items:center;gap:10px;margin:0}.section-number{font-family:'Segoe UI',sans-serif;color:#99abb5;font-size:15px;letter-spacing:.5px;font-weight:400}.text-button{font-size:15px;color:#68818f;display:flex;gap:5px;align-items:center;padding:3px 0}.text-button:hover{color:#1d748a}.text-button svg{width:13px;height:13px}.field-label{font-size:15px;font-weight:500;color:#748591;display:block;margin-bottom:8px}.project-name{height:35px;border:1px solid #dce3e8;background:#fbfcfd;border-radius:4px;width:100%;padding:0 11px;font-size:18px;color:#354e5f}.shape-label{margin-top:20px;margin-bottom:10px}.shape-options{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.shape-card{border:1px solid #e0e7ec;background:#fff;border-radius:5px;padding:10px 3px 11px;position:relative;transition:background .15s,border .15s}.shape-card>svg{width:72px;height:54px;display:block;fill:none;stroke:#94a3ae;stroke-width:1.3;margin:0 auto 7px;stroke-linejoin:round}.shape-card .rear{opacity:.5}.shape-card>span{display:block;font-weight:550;font-size:16.5px}.shape-card>small{display:block;font-size:12px;color:#94a0a8;margin-top:5px}.shape-card>i{display:none;position:absolute;right:5px;top:5px;color:#347e99}.shape-card>i svg{width:12px;height:12px;stroke-width:2}.shape-card.active{background:#f0f6fa;border-color:#6b98b3;box-shadow:0 0 0 1px #6b98b30d}.shape-card.active>svg{stroke:#44738f}.shape-card.active>i{display:block}.shape-card:hover{border-color:#8babbc}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:20px}.unit-input{display:flex;align-items:center;border:1px solid #dce3e8;background:#fbfcfd;border-radius:4px;padding-right:10px;height:35px}.unit-input:focus-within{border-color:#5294a3}.unit-input input{width:100%;min-width:0;border:0;background:transparent;padding:8px 10px;font-variant-numeric:tabular-nums;color:#344e60;font-size:18px}.unit-input input:focus{outline:0}.unit-input>span{font-size:15px;color:#9da9b0}.brace-setting{display:flex;align-items:center;justify-content:space-between;margin-top:15px}.brace-setting .field-label{margin:0}.brace-setting select{width:198px;height:31px;background:#fff;border:1px solid #e1e7eb;border-radius:4px;color:#6d808c;padding:0 8px;font-size:15px}.panel-section{padding-top:23px;padding-bottom:18px}.panel-section .section-heading{margin-bottom:10px}.count-badge{font-size:13.5px;font-family:'Segoe UI',sans-serif;border-radius:3px;color:#83929c;background:#f0f3f5;min-width:18px;height:17px;display:grid;place-items:center;margin-left:-2px}.section-description{font-size:13.5px;color:#9aa5ad;margin:0 0 20px 24px;line-height:1.7}.panel-column-labels{display:grid;grid-template-columns:58px 1fr 1fr 1fr;gap:9px;font-size:13.5px;color:#8b9aa4;padding:0 11px 10px}.panel-column-labels b{font-size:12px;font-weight:400;color:#acb6bd;margin-left:2px}.panel-row{border:1px solid #e3e9ed;border-radius:5px;margin-bottom:8px;padding:11px 10px;position:relative;background:#fff;transition:border-color .2s}.panel-row.active{border-color:#80a9bf;background:#f5f9fc;box-shadow:inset 3px 0 #4c87ab}.panel-main{display:grid;grid-template-columns:58px 1fr 1fr 1fr;gap:9px;align-items:center}.panel-select{text-align:left;padding:0}.panel-select strong{font-size:16.5px;letter-spacing:.5px;font-weight:600;display:flex;gap:5px;align-items:center}.panel-select strong::before{content:'';width:4px;height:4px;border-radius:50%;background:#a7b6bf}.panel-row.active .panel-select strong::before{background:#4685ab}.panel-select small{font-size:12px;display:block;color:#9aa8b2;margin-top:5px;font-variant-numeric:tabular-nums}.panel-main input{height:31px;border:1px solid #e0e7ec;border-radius:3px;width:100%;min-width:0;padding:4px 7px;font-variant-numeric:tabular-nums;color:#3c596b;background:#fff;font-size:16.5px}.panel-main input:disabled{color:#adb7be;background:#f5f7f9}.panel-details{margin-top:12px;padding-top:10px;border-top:1px solid #dce7ee;display:grid;grid-template-columns:58px 1fr 1fr 1fr;gap:9px;align-items:center}.panel-details .detail-caption{font-size:12px;color:#8b9faa;line-height:1.6}.panel-details select{min-width:0;width:100%;height:27px;border:1px solid #d9e4ea;border-radius:3px;background:#fff;color:#638095;padding:0 3px;font-size:13.5px}.remove-panel{font-size:13.5px;color:#9b8990;display:flex;align-items:center;gap:3px;padding:0}.remove-panel svg{width:11px;height:11px}.panel-note{display:flex;align-items:center;gap:6px;color:#9aa8b1;font-size:12px;margin-top:14px}.panel-note svg{width:12px;height:12px}.sidebar-bottom{height:35px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 23px;border-top:1px solid var(--border);color:#8c9ca6;font-size:12px;letter-spacing:.3px;background:#fff}.preview{position:relative;overflow:hidden;background:radial-gradient(ellipse at 50% 40%,#fafcfd 10%,#f0f4f7 100%);isolation:isolate}.preview-heading{position:absolute;left:28px;top:25px;z-index:3}.preview-heading>div{display:flex;gap:12px;align-items:center}.preview-heading h2{font-size:18px;font-weight:550;letter-spacing:.4px;margin:0}.live-badge{display:flex;align-items:center;gap:5px;color:#6f9890;background:#e6f0ec;padding:3px 6px;font-size:10.5px;letter-spacing:.6px;border-radius:3px}.live-badge i{height:3px;width:3px;background:#72a492;border-radius:50%}.preview-type{display:block;margin-top:8px;font-size:13.5px;color:#8e9eaa;letter-spacing:.8px}.viewer-tools{display:flex;position:absolute;top:25px;right:24px;gap:3px;z-index:4;align-items:center}.tool-button{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px;border-radius:4px;font-size:13.5px;color:#9ba8b2}.tool-button svg{width:14px;height:14px}.tool-button:hover{background:#e2eaf0;color:#4c7189}.tool-button.selected{color:#63879c;background:#e7eff4}.tool-divider{height:16px;width:1px;background:#d7e0e6;margin:0 5px}#viewport{position:absolute;inset:0}#viewport canvas{display:block;width:100%;height:100%;touch-action:none;outline:0}.loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:12px;color:#7c92a1;font-size:16.5px;z-index:2}.loading-symbol{height:17px;width:17px;border:2px solid #c8d9e3;border-top-color:#507d99;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.model-summary{position:absolute;top:96px;right:27px;width:125px;pointer-events:none}.summary-eyebrow{font-family:'Segoe UI',sans-serif;font-size:10.5px;letter-spacing:1.5px;color:#8f9eaa}.model-summary>div{padding-top:19px}.model-summary>div>span{display:block;font-size:13.5px;color:#95a4af;margin-bottom:4px}.model-summary strong{font-size:30px;font-family:'Segoe UI',sans-serif;font-weight:350;color:#456277;letter-spacing:-.8px;font-variant-numeric:tabular-nums}.model-summary strong small{font-size:16.5px;letter-spacing:0;color:#9aaab6;font-weight:400}.member-count{display:block;margin-top:18px;border-top:1px solid #dfe7ec;padding-top:11px;color:#93a4af;font-size:13.5px}.color-control{position:absolute;right:27px;bottom:105px;display:flex;align-items:center;gap:9px;font-size:12px;color:#91a3af}.color-control>span{margin-right:2px}.color-dot{height:13px;width:13px;border-radius:50%;background:var(--swatch);border:2px solid #f4f7f9;padding:0}.color-dot.active{outline:1px solid #9cadb8;outline-offset:2px}.orientation{position:absolute;left:25px;bottom:93px;width:65px;pointer-events:none}.orientation svg{width:65px;height:65px;overflow:visible}.orientation path{fill:none;stroke-width:1.5}.orientation text{font-size:13.5px;font-family:'Segoe UI',sans-serif}.view-switch{position:absolute;bottom:81px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:3px;padding:4px;background:#ffffffec;border:1px solid #dfe7ed;border-radius:6px;box-shadow:0 3px 10px #22394b05}.view-switch button{display:flex;align-items:center;justify-content:center;gap:6px;padding:8px 16px;font-size:15px;border-radius:3px;white-space:nowrap;color:#8e9ca6}.view-switch button svg{width:13px;height:13px}.view-switch button.active{background:#e8f0f5;color:#3e718e}.view-switch button:hover{color:#3e718e}.viewer-help{position:absolute;bottom:50px;left:0;right:0;display:flex;justify-content:center;align-items:center;gap:6px;color:#a0afb9;pointer-events:none;font-size:12px}.viewer-help svg{width:12px;height:12px}.viewer-help b{padding:0 6px;font-weight:400}.preview-footer{position:absolute;left:0;right:0;bottom:0;height:31px;padding:0 23px;display:flex;align-items:center;justify-content:space-between;font-size:12px;color:#95a5b1;letter-spacing:.2px;border-top:1px solid #e0e7ed;background:#f4f7f9b3}.preview-footer i{display:inline-block;height:4px;width:4px;border-radius:50%;border:1px solid #9baab4;margin-right:6px}.preview-footer b{font-weight:400;margin:0 8px;color:#bac3ca}.dimension-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}.dimension-label{position:absolute;transform:translate(-50%,-50%);padding:3px 6px;font-size:13.5px;background:#f5f8fbe6;border:1px solid #e0e8ef;border-radius:3px;color:#859bad;font-family:'Segoe UI',sans-serif;white-space:nowrap;letter-spacing:.2px}.dimension-label.active-label{color:#34799f;border-color:#bed5e4;background:#edf6fbe6;font-weight:500}.dimension-label.total-label{color:#66869e;border:0;background:#f3f7faee;writing-mode:vertical-rl;transform:translate(-50%,-50%) rotate(180deg);font-size:15px;padding:6px 4px}.toast{position:fixed;bottom:27px;left:50%;transform:translateX(-50%);padding:13px 22px;background:#203e50;color:#eff7fa;font-size:16.5px;border-radius:7px;box-shadow:0 8px 30px #12324733;z-index:100;max-width:min(90vw,550px);line-height:1.7}.toast.error{background:#874f51}dialog{border:1px solid #dce6ed;border-radius:12px;box-shadow:0 20px 80px #18344844;max-width:440px;padding:28px;color:#344f60}dialog::backdrop{background:#12293c55;backdrop-filter:blur(3px)}dialog h2{font-size:20px;margin:0 0 16px}dialog p{color:#7e909d;font-size:18px;line-height:1.9}dialog>div{display:flex;justify-content:flex-end;gap:10px;margin-top:25px}dialog .button{font-size:16.5px}.dark-button{background:#244b62;color:white;border-color:#244b62}.error-message{text-align:center;padding:30px;line-height:2;max-width:440px;background:#f7fafc;border:1px solid #dbe6ed;border-radius:8px}.error-message strong{display:block;font-size:21px;color:#45647b}.error-message small{display:block;font-size:16.5px;margin-top:10px}.preview.expanded{position:fixed;inset:0;z-index:60;min-height:400px}.preview.expanded .preview-footer{padding-right:30px}input::-webkit-inner-spin-button{opacity:.35}
@media(min-width:1600px){.workspace{grid-template-columns:480px minmax(0,1fr)}.setting-section{padding-left:28px;padding-right:28px}.setting-section.basics{padding-bottom:27px}.app-header{padding:0 33px}.shape-card>svg{height:60px}.panel-row{padding-top:13px;padding-bottom:13px}.preview-heading{left:35px;top:30px}.viewer-tools{right:32px;top:30px}.model-summary{right:36px;top:105px}}
@media(max-width:1100px){.workspace{grid-template-columns:400px minmax(0,1fr)}.setting-section{padding-left:18px;padding-right:18px}.app-header{padding:0 20px}.project-top{display:none}.model-summary{right:18px;width:96px}.model-summary strong{font-size:26px}.preview-heading{left:20px}.viewer-tools{right:15px;gap:0}.tool-button{padding:7px}.tool-button>span:not([data-icon]){display:none}.view-switch button{padding:8px 12px}.color-control{right:20px}.viewer-help{font-size:10.5px}.panel-column-labels,.panel-main,.panel-details{grid-template-columns:51px 1fr 1fr 1fr;gap:7px}.shape-card>svg{width:65px}}
@media(max-width:760px){.app-header{height:66px;padding:0 15px;gap:10px}.brand{gap:7px}.brand-icon{width:27px}.brand-icon svg{width:27px}.brand strong{font-size:18px;letter-spacing:1px}.brand small{font-size:12px;letter-spacing:1.4px}.header-actions{gap:2px}.header-quiet{padding:8px}.header-quiet>span:not([data-icon]){display:none}.export-button{padding:8px 10px;font-size:15px;gap:6px}.export-button>span[data-icon=download]{display:none}.workspace-bar{height:37px;padding:0 15px;font-size:12px}.workspace-bar .muted,.workspace-bar .slash{display:none}#save-status{font-size:12px}.workspace{height:auto;min-height:0;display:flex;flex-direction:column}.preview{order:0;height:58dvh;min-height:410px;border-bottom:1px solid var(--border)}.settings{order:1;border:0;overflow:visible}.settings-scroll{overflow:visible}.setting-section{padding:24px 20px}.settings .basics .shape-options{gap:12px}.shape-card>svg{width:80px;height:58px}.sidebar-bottom{height:38px}.preview-heading{top:19px;left:17px}.viewer-tools{top:16px;right:12px}.model-summary{top:80px;width:80px;right:14px}.summary-eyebrow{font-size:9px;letter-spacing:.8px}.model-summary>div{padding-top:13px}.model-summary strong{font-size:24px}.model-summary>div>span{font-size:12px}.member-count{font-size:10.5px;margin-top:12px;padding-top:8px}.preview-type{font-size:12px}.view-switch{bottom:64px}.view-switch button{padding:7px 11px;font-size:13.5px}.viewer-help{bottom:42px;font-size:9px;gap:3px}.viewer-help b{padding:0 2px}.preview-footer{height:27px;font-size:9px;padding:0 15px}.orientation{left:10px;bottom:72px;width:47px}.orientation svg{width:47px;height:47px}.color-control{bottom:115px;right:15px;gap:8px}.color-control>span{display:none}.color-dot{width:11px;height:11px}.panel-column-labels,.panel-main,.panel-details{grid-template-columns:58px 1fr 1fr 1fr;gap:10px}.panel-main input{height:36px}.panel-details select{height:33px;font-size:15px}.panel-select strong{font-size:18px}.panel-select small{font-size:13.5px}.section-description{font-size:15px}.panel-column-labels{font-size:15px}.dimension-label{font-size:12px;padding:2px 4px}.dimension-label.total-label{font-size:13.5px}.section-heading h1,.section-heading h2{font-size:21px}.preview.expanded{height:100dvh}.toast{bottom:18px}dialog{margin:20px;width:calc(100% - 40px)}}