:root{color-scheme:dark;--bg:#101315;--panel:#191d20;--raised:#23292d;--line:#30373c;--muted:#8c989f;--text:#e6edef;--cyan:#4bd6df;--cyan-bg:#15383e;--purple:#b6a5e6;font-family:Inter,'Segoe UI','Noto Sans JP',sans-serif;font-size:13px}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button{cursor:pointer;border:1px solid var(--line);background:#242a2e;color:var(--text);border-radius:7px;padding:10px 14px;transition:background .15s,border-color .15s}button:hover{background:#30393e;border-color:#65747d}button:disabled{opacity:.4;cursor:not-allowed}button:focus-visible,a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}input,select,textarea{color:var(--text);background:#111719;border:1px solid var(--line);border-radius:6px;padding:11px;width:100%;outline:none}input:focus,select:focus,textarea:focus{border-color:var(--cyan);box-shadow:0 0 0 2px #4bd6df15}input::placeholder{color:#68757c}label{display:block;font-size:12px;color:#bdc8ce;line-height:1.7}label input,label select{margin-top:7px}a{color:var(--cyan);text-decoration:none}h1,h2,p{margin:0}h1{font-size:27px;letter-spacing:.02em;font-weight:650;margin:9px 0}h2{font-size:14px;font-weight:600}p{color:var(--muted);line-height:1.8}small{font-size:9px}.topbar{height:78px;padding:0 32px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:36px;background:#171b1e}.brand{display:flex;align-items:center;gap:12px;color:var(--text);font-size:13px;letter-spacing:1.5px;flex-shrink:0}.brand b{font-weight:400;color:#b4c0c6}.brand small{display:block;letter-spacing:2.3px;margin-top:5px;color:#75838b}.brandmark{display:grid;place-content:center;font-size:29px;line-height:1;border:1px solid #36565c;color:var(--cyan);width:40px;height:40px;border-radius:11px;position:relative}.brandmark span{position:absolute;font-size:15px;right:2px;top:14px;background:#171b1e}.workspace{display:flex;align-items:center;gap:10px;font-size:12px;min-width:0}.workspace #filename{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dot{display:inline-block;width:6px;height:6px;background:var(--cyan);border-radius:50%;flex-shrink:0}.badge{display:inline-block;font-size:10px;color:#9aa8af;border:1px solid #3a444a;border-radius:4px;padding:4px 6px;letter-spacing:.5px;white-space:nowrap}.connect{margin-left:auto;white-space:nowrap}.connect span{font-size:18px;color:var(--cyan);margin-right:6px}.navigation{display:flex;padding:0 32px;height:56px;border-bottom:1px solid var(--line);gap:24px}.nav{background:none;border:none;border-radius:0;color:var(--muted);position:relative;padding:0 4px;font-size:12px;white-space:nowrap}.nav.active{color:var(--cyan)}.nav.active:after{content:'';position:absolute;bottom:-1px;left:0;right:0;height:2px;background:var(--cyan)}.nav span:first-child{margin-right:6px;font-size:16px}.nav:hover{background:transparent;color:var(--text)}.counter{font-size:10px;background:#30373b;border-radius:4px;padding:2px 5px;margin-left:4px}.nav-spacer{flex:1}.local-label{align-self:center;font-size:9px;letter-spacing:1.4px;color:#6f818a}main{max-width:1640px;margin:auto;padding:29px 32px 0}.page-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:25px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--cyan);font-weight:600}.eyebrow span{color:#58656d;margin:0 9px}.page-heading p{font-size:12px}.heading-actions{display:flex;gap:8px;align-items:center}.primary{background:var(--cyan);color:#082b31;border-color:var(--cyan);font-weight:650}.primary:hover{background:#7de5ed;border-color:#7de5ed}.primary span{margin-left:12px}.panel{background:var(--panel);border:1px solid var(--line);border-radius:10px;min-width:0}.editor-layout{display:grid;grid-template-columns:185px minmax(0,1fr) 250px;gap:16px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:19px 18px}.panel-heading p{font-size:12px;margin-top:7px}.tiny{font-size:10px;color:var(--muted)}.layers-panel{padding-bottom:16px;display:flex;flex-direction:column}.layers-panel .panel-heading{padding-bottom:12px}#layers{padding:0 10px}.layer{display:flex;width:100%;align-items:center;gap:11px;border:1px solid transparent;background:transparent;color:var(--muted);padding:13px 10px;margin-bottom:5px;text-align:left}.layer .number{font-family:Consolas,monospace;border:1px solid #3a444a;border-radius:5px;width:25px;height:25px;display:grid;place-content:center;font-size:11px}.layer .layer-text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.layer.active{border-color:#28565e;background:#183037;color:var(--cyan)}.layer.active .number{background:#1b444d;border-color:#31646e}.dashed{border-style:dashed;background:none;margin:12px 12px 0;font-size:11px;color:var(--muted);padding:11px 5px}.layer-note{margin-top:auto;padding:38px 17px 8px}.layer-note>span{display:block;color:#4d6976;font-size:22px;margin-bottom:12px}.layer-note strong{font-size:10px;color:#b2c1c8;font-weight:500}.layer-note p{font-size:10px;margin-top:9px;line-height:2}.keyboard-panel{overflow:hidden;align-self:start}.keyboard-toolbar{height:65px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:12px}.keyboard-toolbar strong{font-weight:500;font-size:13px}.keyboard-toolbar .tiny{margin-left:10px}.compact{display:flex;align-items:center;gap:8px;font-size:10px;white-space:nowrap}.compact select{font-size:11px;margin:0;width:auto;padding:6px;background:#20272b}.canvas{min-height:360px;padding:21px 18px 12px;background:radial-gradient(ellipse at 50% 70%,#23333830,transparent 65%),radial-gradient(#48545a44 .65px,transparent .65px);background-size:auto,18px 18px;overflow:auto}.canvas-label{font-size:9px;letter-spacing:1px;color:#91a6af;display:flex;align-items:center;gap:8px}.canvas-label #dirty-label{margin-left:auto;letter-spacing:0;color:var(--muted);padding:4px 7px;border:1px solid #323c42;border-radius:15px}.keyboard{display:grid;grid-template-columns:repeat(12,minmax(33px,1fr));gap:7px;min-width:535px;max-width:790px;margin:62px auto 28px;padding:0 2px}.keyboard.corne{grid-template-columns:repeat(6,minmax(32px,1fr)) 20px repeat(6,minmax(32px,1fr));row-gap:8px}.key{position:relative;aspect-ratio:1/1.04;border-radius:7px;border:1px solid #465158;background:linear-gradient(145deg,#323a3f,#272e32);box-shadow:0 3px 0 #0e1316,0 4px 0 #364047,inset 0 1px 0 #ffffff09;padding:5px 2px;font-size:12px;font-weight:500;min-width:0}.key>span{display:block;text-overflow:ellipsis;overflow:hidden;white-space:nowrap}.key small{position:absolute;top:4px;left:5px;font-size:7px;color:#788890}.key.active{background:linear-gradient(145deg,#225963,#1b424c);border-color:var(--cyan);box-shadow:0 3px 0 #102d33,0 4px 0 #53bac6;color:#8fedf5}.key.special{color:var(--purple)}.key.active.special{color:var(--cyan)}.key:hover{transform:translateY(-1px);border-color:#8aabb8}.canvas-caption{font-size:10px;color:#778a95;text-align:center;margin-top:36px;letter-spacing:.5px}.canvas-caption span{margin:0 8px}.keyboard-footer{display:flex;align-items:center;justify-content:space-between;padding:12px 18px;border-top:1px solid var(--line);font-size:9px;color:var(--muted)}.keyboard-footer button{padding:3px 9px;font-size:18px;background:transparent;margin-left:5px}.legend{display:inline-block;width:6px;height:6px;border-radius:2px;background:#65727b;margin:0 5px 0 12px}.legend:first-child{margin-left:0}.legend.cyan{background:var(--cyan)}.legend.purple{background:var(--purple)}.inspector{padding:0 17px 18px}.inspector .panel-heading{padding:19px 0}.selected-preview{display:flex;flex-direction:column;align-items:center;padding:0 0 20px;gap:12px}.selected-preview>div{width:68px;height:66px;display:grid;place-content:center;background:linear-gradient(145deg,#2a4149,#203038);border:1px solid #47737c;border-radius:11px;box-shadow:0 4px 0 #101a20;font-size:25px;color:var(--cyan);max-width:100%;overflow:hidden}.selected-preview>span{font-size:9px;letter-spacing:2px;color:var(--muted)}.inspector label{margin-bottom:13px;font-size:11px}.inspector input,.inspector select{font-size:12px;padding:9px}.field-help{font-size:10px;line-height:1.9;color:var(--muted);margin:9px 0 14px}.full{width:100%}.check{display:flex;align-items:center;gap:7px;color:var(--muted);margin-top:12px}.check input{width:auto;margin:0;accent-color:var(--cyan)}.inspector-separator{height:1px;background:var(--line);margin:16px 0}.mono,textarea,pre{font-family:'Cascadia Code',Consolas,monospace}.palette{margin-top:17px;padding:20px}.palette-top{display:flex;align-items:center;justify-content:space-between;gap:20px}.palette-top p{font-size:11px;margin-top:6px}.palette-top input{max-width:230px;font-size:11px;padding:10px}.categories{display:flex;gap:20px;border-bottom:1px solid var(--line);margin:16px 0 17px;overflow:auto}.categories button{background:none;border:0;border-radius:0;padding:10px 0;color:var(--muted);font-size:11px;white-space:nowrap}.categories button.active{border-bottom:2px solid var(--cyan);color:var(--cyan)}.key-options{display:flex;flex-wrap:wrap;gap:7px}.key-options button{min-width:37px;height:34px;padding:7px 10px;background:#252c30;border-color:#3c474d;font-size:11px;box-shadow:0 2px 0 #101518}.key-options button:hover{border-color:var(--cyan);color:var(--cyan)}footer{display:flex;justify-content:space-between;gap:14px;align-items:center;padding:24px 0;color:#70828c;font-size:10px}footer .dot{width:5px;height:5px;margin-right:6px}footer b{font-weight:400;margin-left:7px;color:#4f626c;font-size:9px}footer a{color:#8d9da5}.notice,.model-warning{padding:12px 16px;border:1px solid #31565c;background:#183038;color:#b9e5e8;border-radius:6px;font-size:12px;line-height:1.8;margin-bottom:16px}.notice.error,.model-warning{background:#362c24;border-color:#63503c;color:#efd5ad}.model-warning{margin:12px}.source-panel{padding-bottom:16px}.source-panel textarea{display:block;width:calc(100% - 36px);margin:0 18px;min-height:490px;resize:vertical;line-height:1.8;font-size:13px;tab-size:4;white-space:pre;overflow:auto}.source-panel>.field-help{margin:12px 18px}.diff{margin:0 18px 20px;background:#101719;padding:16px;border:1px solid var(--line);border-radius:7px;max-height:480px;overflow:auto;font-size:12px;line-height:1.8}.diff .add{display:block;background:#113c2b;color:#9ae4b7}.diff .remove{display:block;background:#442329;color:#eea5ae}.diff .same{display:block;color:#73878e}.commit-form{padding:0 18px;display:flex;align-items:end;gap:12px}.commit-form label{flex:1}.commit-form button{height:40px}#review-view>.field-help{padding:0 18px}.empty-state{color:var(--muted);padding:64px 24px;text-align:center;font-size:12px}.run{display:flex;gap:18px;align-items:center;border-top:1px solid var(--line);padding:18px 22px}.run .run-text{flex:1}.run p{font-size:11px;margin-top:5px}.run .status{color:var(--cyan);font-size:10px}.run .failed{color:#ed9da8}dialog{background:#1b2227;border:1px solid #435159;border-radius:14px;color:var(--text);width:min(550px,calc(100vw - 32px));padding:26px;box-shadow:0 30px 120px #0009;max-height:90vh;overflow:auto}dialog::backdrop{background:#060b10b8;backdrop-filter:blur(6px)}dialog label{margin-top:16px}dialog>form>p{margin-top:10px;font-size:12px}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading h2{font-size:21px;margin-top:9px}.dialog-heading button{font-size:23px;background:none;border:none;padding:0 8px}.dialog-actions{display:flex;justify-content:space-between;gap:12px;margin-top:22px}.file-picker{display:flex;align-items:end;gap:10px}.file-picker label{flex:1}.file-picker button{height:42px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}[hidden]{display:none!important}
.model-warning.info{background:#19252b;border-color:#2d424d;color:#91a6b1;font-size:10px}
.oauth-card{border:1px solid #31565c;background:#182c32;border-radius:9px;padding:17px;margin-top:18px}.oauth-card #account-status{font-weight:600;color:var(--cyan)}.oauth-card .check{margin-top:10px}details{margin-top:20px;border-top:1px solid var(--line);padding-top:15px}summary{cursor:pointer;color:var(--muted);font-size:11px}#repository-picker{margin-top:18px}#more-repos,#more-branches{margin-top:8px;font-size:11px}
@media(min-width:1450px){.canvas{min-height:410px}.keyboard{margin-top:75px}.editor-layout{grid-template-columns:200px minmax(0,1fr) 270px}}
@media(max-width:1150px){.editor-layout{grid-template-columns:145px minmax(0,1fr)}.inspector{grid-column:1/-1;display:grid;grid-template-columns:110px 1fr 1fr 1fr;align-items:center;gap:12px;padding:16px}.inspector .panel-heading{grid-column:1/-1;padding:0}.inspector .selected-preview{grid-row:2/4;padding:0}.inspector label{margin:0}.inspector .field-help,.inspector-separator{display:none}.inspector .check{font-size:10px}.layer-note{padding-top:20px}.canvas{min-height:340px}.topbar{gap:22px}.workspace{max-width:300px}.heading-actions button{font-size:11px}.layer-note strong{font-size:9px}}
@media(max-width:760px){.topbar{height:66px;padding:0 16px;gap:12px}.brand{font-size:11px;letter-spacing:.6px}.brand small{font-size:7px;letter-spacing:1.2px}.brandmark{width:32px;height:32px;font-size:24px}.brandmark span{top:11px}.workspace{display:none}.connect{font-size:11px;padding:8px 10px}.navigation{padding:0 16px;gap:20px;height:51px;overflow:auto}.local-label{display:none}.nav{font-size:11px}.nav-spacer{display:none}main{padding:22px 16px 0}.page-heading{align-items:start;flex-direction:column;gap:18px}.heading-actions{width:100%;flex-wrap:wrap}.heading-actions button{flex:1;font-size:10px;padding:10px 8px;white-space:nowrap}h1{font-size:24px}.editor-layout{display:flex;flex-direction:column;gap:12px}.layers-panel{display:block;padding:10px}.layers-panel .panel-heading,.layer-note{display:none}#layers{display:flex;gap:5px;overflow:auto;padding:0}.layer{width:auto;padding:7px 10px;margin:0;min-width:90px}.layer .number{width:21px;height:21px}.dashed{margin:10px 0 0;width:100%;padding:7px}.keyboard-panel{width:100%}.keyboard-toolbar{padding:0 12px}.keyboard-toolbar .tiny{display:none}.canvas{padding:15px 10px;min-height:310px}.keyboard{margin-top:44px}.keyboard-footer{font-size:8px;padding:10px}.legend{margin-left:6px}.inspector{grid-template-columns:85px 1fr 1fr;gap:12px;padding:15px}.inspector .selected-preview{grid-row:2/4}.inspector label{font-size:10px}.inspector input,.inspector select{font-size:11px}.inspector .primary{font-size:11px}.inspector>label:has(#binding){grid-column:2/-1}.palette{padding:15px}.palette-top input{max-width:145px}.palette-top p{font-size:10px}.categories{gap:18px}.key-options{gap:6px}.key-options button{min-width:34px;padding:5px 8px}footer{font-size:9px;flex-wrap:wrap}footer>span:nth-child(2){display:none}.commit-form{flex-wrap:wrap}.commit-form label{flex-basis:100%}.panel-heading{padding:16px}.source-panel textarea{min-height:450px;font-size:11px}.dialog-actions button{font-size:12px}}

.keyboard.physical{display:block;position:relative;min-width:0;max-width:none;margin:28px auto;padding:0;flex-shrink:0}.keyboard.physical .key{position:absolute;aspect-ratio:auto}.keyboard-toolbar{height:auto;min-height:65px;flex-wrap:wrap;padding-top:10px;padding-bottom:10px}.keyboard-toolbar .compact select{max-width:240px}#import-layout{font-size:11px;padding:6px 8px}
