*{box-sizing:border-box} :root{--case:#073d43;--ink:#101d20;--accent:#bd004a}body{margin:0;background:radial-gradient(ellipse at 45% 30%,#175e64,var(--case) 70%);color:var(--ink);font:15px Arial,sans-serif;min-height:100vh}button,select,input,textarea{font:inherit}button,a,select,.upload{touch-action:manipulation}button,select,.upload{border:1px solid #566367;border-radius:4px;background:linear-gradient(#eef0ee,#adb4b4);box-shadow:0 2px 3px #0005;color:var(--ink);padding:10px;cursor:pointer}button:disabled{opacity:.4;cursor:default}button:hover{filter:brightness(1.08)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,.word:focus-visible{outline:3px solid #ffcf45;outline-offset:3px}header{margin:8px;padding:17px 24px;border:2px solid #072b30;border-radius:8px;box-shadow:inset 0 1px #77a2a4;display:flex;gap:20px;align-items:center;color:#eee}header a{color:#eee;white-space:nowrap}.brand{font:900 58px Impact,'Arial Black',sans-serif;letter-spacing:-2px;color:#d7dddd;display:flex;align-items:center;gap:25px}.brand small{letter-spacing:1px;font:16px Arial;max-width:150px}nav{display:flex;flex:1;border:1px solid #aaa;border-radius:4px;overflow:hidden}nav span{padding:13px 16px;text-align:center;flex:1;background:#09272b;font-size:13px;color:#aaa}nav .active{background:var(--accent);color:white}main{display:grid;grid-template-columns:240px minmax(320px,1fr) 275px;gap:12px;margin:12px}.metal{position:relative;background:repeating-linear-gradient(0deg,#fff2 0px,#fff0 1px,#0001 2px,#fff0 3px),linear-gradient(120deg,#dfe2e0,#b5bbba 55%,#d7dbd9);border:3px solid #25383c;border-radius:9px;box-shadow:inset 0 1px 2px #fff,0 3px 4px #0007;padding:21px 17px}.metal:before,.metal:after{content:'⊕';position:absolute;top:4px;font-size:14px;color:#263134;text-shadow:0 1px white}.metal:before{left:7px}.metal:after{right:7px}h2{font:18px Impact,'Arial Narrow',sans-serif;letter-spacing:1px;margin:0 0 13px}aside section{margin-bottom:12px}input:not([type=range]):not([type=color]):not([type=file]),textarea,select{width:100%;margin-bottom:8px}header select{width:auto;max-width:130px;margin:0}textarea,input[type=search]{background:#edf0ec;padding:9px;border:1px solid #5d6c70;border-radius:3px}input[type=range]{width:100%;accent-color:var(--accent)}input[type=color]{margin-top:10px;width:100%;height:30px;border:0;padding:0;background:none}output{display:block;text-align:center;margin-top:8px;font-family:monospace}.tabs{display:flex;gap:7px;margin-bottom:10px}.tabs button{flex:1;padding:8px 4px}.library .metal>button,.controls .metal>button{width:100%;margin-top:8px}.workspace{padding:16px;align-self:start}#sheet{position:relative;aspect-ratio:3/4;width:100%;background:#faf9f5;overflow:hidden;box-shadow:0 2px 4px #0003;container-type:inline-size;isolation:isolate}#sheet .word{position:absolute;white-space:pre;line-height:1.2;cursor:grab;touch-action:none;transform-origin:center;max-width:none;user-select:none}#sheet .word.selected{outline:2px solid var(--accent);outline-offset:4px}#sheet .word.selected:after{content:'';position:absolute;width:7px;height:7px;background:var(--accent);right:-7px;bottom:-7px}.help{font-size:12px;line-height:1.5;margin:14px 0 0}.swatches{display:flex;gap:8px}.swatches button{height:32px;flex:1;padding:0;border:2px solid #eee}.swatches button[aria-pressed=true]{outline:2px solid var(--accent)}.primary{background:linear-gradient(#d60056,#a0003b);color:white;font-weight:bold}.dial{height:65px;width:65px;border:5px solid #526164;border-radius:100%;background:conic-gradient(#09272e,#29474b,#061c22,#29474b,#09272e);margin:auto;box-shadow:0 3px 5px #0009;position:relative}.dial:after{content:'';position:absolute;left:26px;top:2px;width:3px;height:18px;background:var(--accent)}#resources{display:grid;grid-template-columns:90px 90px;justify-content:center;gap:10px;max-height:390px;overflow-y:auto;overflow-x:hidden;padding:4px 0 15px}.resource{width:90px;height:90px;padding:6px;word-break:break-word;background:#e9e8df;font:14px Georgia;overflow:hidden}.resource.template{background-size:cover;background-position:center}.upload{display:block;text-align:center;font-size:12px;margin-top:12px}.upload input{display:block;max-width:100%;font-size:11px;margin-top:8px}.pending{font-size:12px;color:#bed1d2;line-height:1.5}footer{margin:12px;display:flex;gap:15px;align-items:center}.toolbar{display:flex;gap:10px;flex:1;align-items:center}.toolbar .upload{margin:0}footer strong{font:22px Impact,sans-serif;color:#b6cecf;letter-spacing:2px;padding:15px}#status{color:white;font-size:13px;margin:15px}#count{font-size:12px}@media(min-width:1500px){main{grid-template-columns:270px minmax(400px,850px) 320px;justify-content:center}}@media(max-width:1100px){header{flex-wrap:wrap}.brand{font-size:45px}nav{order:4;flex-basis:100%}main{grid-template-columns:215px minmax(260px,1fr) 220px}.metal{padding:18px 12px}footer{flex-wrap:wrap}}@media(max-width:760px){header{padding:12px;gap:12px}.brand{font-size:38px}.brand small{font-size:12px}.brand{flex:1}header a{font-size:12px}nav span{padding:10px 3px;font-size:11px}main{grid-template-columns:1fr 1fr}.workspace{grid-column:1/-1;grid-row:1}.library,.controls{min-width:0}.toolbar{flex-wrap:wrap}.toolbar button{flex:1}.toolbar .upload{width:100%}footer strong{font-size:16px}.resource{font-size:12px}#resources{gap:6px}header select{max-width:100px}}

.brand img{width:230px;height:90px;object-fit:contain}@media(max-width:760px){.brand img{width:160px;height:65px}}

[hidden]{display:none!important}.resource.template{padding:0}.resource.template img{display:block;width:100%;height:100%;object-fit:contain;background:#fff}.resource.missing{border:2px solid #bd004a}#font-status{font-size:12px;overflow-wrap:anywhere}select{min-width:0}