:root{--action-radius:999px}
:root{--accent:#c94b0c;--muted:#79746e;--line:#ece7e0;--panel:#f7f5f1;--ui-ink:#302d29;--ui-muted:#79736b;--ui-soft:#fcebdd;--ui-line:#e9e4dd;--ui-surface:#fffdfa;--ui-field:#f3f0eb;color:var(--ui-ink);background:#eeeae4}
.app-window,dialog{color:var(--ui-ink);font-family:var(--app-font)}
.app-window{border-color:#ded9d2;box-shadow:0 22px 52px -20px #51443738,0 2px 5px #51443709}
.shelf-design{max-width:1120px;background:var(--ui-surface)}
.direction-titlebar,.toolbar,.gallery-top{background:#fffdf9;border-color:var(--ui-line)}
.direction-titlebar .brand{gap:8px}.direction-titlebar .brand-icon{width:33px;height:33px}.brand-icon img{border-radius:9px}
.direction-nav button{border-radius:8px;color:#7b746b;font-size:12px;padding:9px 12px}
.direction-nav button.selected,.nav-item.selected,.gallery-nav button.selected,.pack-list-row.selected,.rail-button.selected{background:var(--ui-soft);color:#a23c0b}
.direction-nav button:hover,.nav-item:hover{background:#f4eee5}
.button,.pungo-select{min-height:34px;border:1px solid var(--ui-line);border-radius:9px;background:#fffdf9;color:#51483d;box-shadow:0 1px 2px #48362108;font-size:12px;font-weight:500;padding:8px 13px;transition:background-color 120ms,color 120ms,box-shadow 120ms}
.button{border-radius:var(--action-radius)}
.button:hover,.pungo-select:hover{background:#f7f2ea;border-color:#ded5c8}
.button:active,.pungo-select:active{background:#efe7da;box-shadow:none}
.button.primary{background:var(--accent);border-color:var(--accent);color:#fff;box-shadow:0 2px 4px #aa3d101a}
.button.primary:hover{background:#b64109;border-color:#b64109}.button.primary:active{background:#a13a08}
.button.soft{background:#f7eadd;color:#985126;border-color:transparent;box-shadow:none}
.button.danger{color:#b13d32;background:#fff8f5;border-color:#f0ded8}.button.danger:hover{background:#fbe9e3}
.button:disabled,.pungo-select:disabled{opacity:.45;cursor:default}
.text-button,.back-button{color:var(--accent)}.icon-button{color:#8a7d6e;border-radius:7px}.icon-button:hover{background:#f4ebe0}.icon-button.favorited{color:#c35322}
.app-window .state-button.selected,.identity-card.selected,.font-choice.selected,.catalog-row.selected{background:#f9ecdf;border-color:transparent;outline:none;box-shadow:none;color:#994211}
.shelf-item.selected>div,.canvas-pack-option.selected>span{border-color:transparent;outline:none;box-shadow:none}
.shelf-item.selected strong{color:#ab460c}.shelf-current,.pack-check{background:#fff6e9;color:var(--accent)}
.identity-rounds button.selected,.identity-check .icon,.font-choice>.icon{color:var(--accent)}
.shelf-content{padding:26px 34px 20px;gap:25px}.shelf-workspace{grid-template-columns:minmax(0,1fr) 275px;gap:38px}
.shelf-preview-heading{color:#827568}.shelf-canvas{border-radius:16px}.shelf-detail h1{letter-spacing:-.9px}
.shelf-description,.shelf-facts dt,.shelf-apply p{color:#81776c}.shelf-facts dd{color:#51483e}.detail-kicker{color:#887966}
.shelf-detail-top{margin-bottom:14px}.shelf-apply>.button{min-height:39px;font-size:12px;border-radius:var(--action-radius)}
.shelf-item>div{border-radius:12px}.shelf-item strong{font-size:11px;color:#71675a}.shelf-collection h2{font-size:13px}.shelf-collection h2 span{color:#a29483}
.statusbar{background:#fcfaf6;border-color:var(--ui-line);color:#887d6e}.statusbar .text-button{color:#a15328}
.search{gap:8px;padding:0 10px;border-radius:8px;background:var(--ui-field);border:1px solid transparent;color:#9b8d7b;min-height:32px}
.search input{color:#524839;font-size:11px;min-width:0;background:transparent;padding:7px 0}
.search input::placeholder,.test-pad input::placeholder{color:#968b7c}
input:not([type=range]):not([type=file]):not([type=search]),textarea{border:1px solid var(--ui-line);background:#faf7f1;border-radius:8px;color:var(--ui-ink);padding:9px 11px;font:inherit}
.test-pad{background:#f7f3ec;border-color:var(--ui-line)}.test-pad input{display:block;margin-top:10px;width:100%}.test-pad a{color:var(--accent)}
.playback-bar{background:#f7f3ec;border-color:var(--ui-line);border-radius:9px}.playback-bar .icon-button,.frame-count{color:#9a7a5c}
input[type=range]{accent-color:var(--accent)}
.toggle{width:36px;height:22px;padding:3px;background:#d7d1c8}.toggle:after{height:16px;width:16px}.toggle[aria-checked=true]{background:var(--accent)}.toggle[aria-checked=true]:after{transform:translateX(14px)}
.settings-content{background:#f8f5ef}.settings-wrap{max-width:700px;padding-bottom:8px}.settings-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.settings-heading h1{font-size:28px;letter-spacing:-.8px;margin:0 0 6px}.settings-heading p{color:var(--ui-muted);font-size:12px;margin:0}.settings-heading img{width:50px;height:50px;border-radius:13px}
.settings-wrap h2{font-size:11px;font-weight:600;color:#897763;margin:22px 0 9px;padding-left:2px}.settings-group{border:1px solid var(--ui-line);background:var(--ui-surface);border-radius:12px;padding:0 18px}.settings-group .detail-row{border-color:#f0ebe4;padding:16px 0;gap:22px}.settings-group .detail-row:last-child{border:0}.settings-group strong{font-size:12px;font-weight:500}.settings-group small{color:#938574;font-size:11px;line-height:1.5;margin-top:4px}.settings-group .pungo-select{min-width:152px}.settings-footer{color:#988b7a;font-size:10px}.settings-wrap>.text-button{font-size:10px}
.pungo-select{display:inline-flex;align-items:center;justify-content:space-between;gap:16px;white-space:nowrap;max-width:100%;flex-shrink:0;text-align:left;cursor:default;line-height:1.2}
.pungo-select>span{overflow:hidden;text-overflow:ellipsis}.pungo-select>svg{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;color:#a4886d}
.pungo-select[aria-expanded=true]{background:#f3e9dd;border-color:#dfcdb9}
.pungo-select.compact-select{font-size:10px;min-height:22px;padding:2px 5px;gap:4px;background:transparent;border-color:transparent;box-shadow:none}.compact-select>svg{height:11px;width:11px}.compact-select:hover{background:#ece2d5}
.round-select-label .pungo-select{min-height:29px;font-size:10px;padding:6px 9px;gap:14px}.heading-row>.pungo-select{font-size:11px}
.pungo-menu{position:fixed;inset:auto;margin:0;padding:5px;border:1px solid #ded2c1bb;border-radius:11px;background:#fffdf8f5;backdrop-filter:blur(20px);box-shadow:0 14px 35px #49352224,0 2px 7px #4935220d;color:#4b3f30;overflow:auto;z-index:9999;font:12px var(--app-font,-apple-system,sans-serif)}
.pungo-menu [role=option]{padding:9px 30px 9px 10px;border-radius:6px;position:relative;cursor:default;line-height:1.4}.pungo-menu [role=option][aria-selected=true]:after{content:'✓';position:absolute;right:10px;color:var(--accent);font-size:12px;font-weight:600}.pungo-menu [role=option].highlighted{background:#f9e7d5;color:#9e3d0b}
.review-bar{color:#5e5347}.review-brand{color:#40382f}.review-brand>span{color:#928675}.direction-note{color:#928575}.review-actions>.text-button{color:#aa5425}
dialog{background:#fffdfa;border-color:#fff8ee;box-shadow:0 25px 85px #46332135}dialog::backdrop{background:#31281d35}.modal-subtitle,.info-note{color:#877967}.modal-actions{border-color:var(--ui-line)}
html :is(button,a,input,select,textarea):focus{outline:none}
html[data-input=keyboard] :is(button,a,input,select,textarea):focus{outline:2px solid #d2763c;outline-offset:3px}
html[data-input=keyboard] .search:has(input:focus){outline:2px solid #d2763c;outline-offset:3px}
html[data-input=keyboard] .search input:focus{outline:none}
[hidden]{display:none!important}
.canvas-design{--accent:#f79857;--ui-line:#51483d;--ui-field:#35322f;--ui-surface:#2b2926;--ui-ink:#f3e9dd;background:#292724;color:#efe7dd}
.canvas-design .direction-titlebar,.canvas-design .statusbar{background:#2b2824;border-color:#413b33}.canvas-design .direction-nav button.selected{background:#4b3423;color:#ffbd8b}.canvas-design .button.primary{background:#f49a59;border-color:#f49a59;color:#382314}.canvas-design .button,.canvas-design .pungo-select{background:#39332c;border-color:#504639;color:#e7d4bd}.canvas-design .button.soft{background:#463a2c;color:#dfb887}.canvas-design .text-button{color:#e7a777}.canvas-design input[type=range]{accent-color:#ee9557}.canvas-design .settings-content{background:#292724}.canvas-design .settings-group{background:#302c27}.canvas-design .settings-heading h1{color:#f2e7da}.canvas-design .settings-group .detail-row{border-color:#443c32}.canvas-design .settings-group small{color:#b4a38e}
@media(min-width:801px) and (max-height:800px){.shelf-content{padding:21px 30px 17px;gap:20px}.shelf-workspace{gap:34px;grid-template-columns:minmax(0,1fr) 270px}.shelf-detail-top{margin-bottom:10px}.shelf-detail h1{font-size:29px}.shelf-apply>.button{min-height:36px}.shelf-item>div{height:64px}.direction-nav button{font-size:11px;padding:8px 10px}.settings-group .detail-row{padding:13px 0}.settings-wrap h2{margin-top:19px}.settings-heading{margin-bottom:18px}}
@media(max-width:900px){.shelf-workspace{grid-template-columns:minmax(0,1fr) 220px;gap:24px}.direction-nav button{font-size:10px;padding:8px}.settings-group .detail-row{gap:12px}}
@media(max-width:620px){.shelf-content{padding:19px}.shelf-workspace{display:flex}.direction-nav button{padding:7px 5px;font-size:9px}.settings-group .detail-row{flex-wrap:wrap}.settings-group .pungo-select{min-width:132px}.settings-heading h1{font-size:25px}.settings-heading p{font-size:11px}.search input{width:105px}.round-select-label .pungo-select{max-width:120px}.settings-heading img{height:40px;width:40px}}
@media(prefers-reduced-motion:reduce){.button,.pungo-select,.toggle:after{transition:none}}
@media(prefers-reduced-transparency:reduce){.pungo-menu{background:#fffdf8;backdrop-filter:none}}
@media(prefers-contrast:more){:root{--ui-line:#a09381;--ui-muted:#514535}.pungo-menu{background:#fffdf8}.settings-group small,.shelf-description,.shelf-apply p{color:#655643}}
