@font-face{font-family:ShopThai;src:url('/fonts/shop-thai.woff2') format('woff2');font-display:swap;font-weight:100 900}
:root{--atelier-gold:#e7cc91;--atelier-ink:#f5f2e9;--atelier-panel:#132638}
body{font-family:ShopThai,system-ui,sans-serif;background-color:#060b13}
.role-switch{display:grid;grid-template-columns:1fr 1fr;gap:5px;padding:5px;margin:4px 0 22px;border:1px solid #e7cc9133;background:#0a121f;border-radius:18px}
.role-switch a{display:flex;align-items:center;justify-content:center;min-height:50px;padding:10px 8px;text-decoration:none;color:#bdccdf;border-radius:13px;font-size:14px;font-weight:600;line-height:1.5;text-align:center}
.role-switch a[aria-current=page]{background:linear-gradient(120deg,#f3dfb2,#d8b877);color:#102542;box-shadow:0 3px 18px #e7cc9114}
.hero{border:1px solid #e7cc913d;border-radius:24px;isolation:isolate;overflow:hidden;box-shadow:0 20px 70px #0005}
.hero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(125deg,transparent 25%,#e7cc910d 60%,transparent 85%);pointer-events:none}
.hero-grid{opacity:.3}.hero-edition{letter-spacing:.15em}.status-dot{box-shadow:0 0 0 5px #e7cc9110,0 0 20px #e7cc9133;animation:atelier-pulse 3s ease-in-out 2}
.shop-front .shop-actions{gap:12px;margin-top:22px}.shop-front .shop-actions .main-task,.shop-front .shop-catalog-link{border-radius:20px;border:1px solid #e7cc9138;background:linear-gradient(135deg,#183047,#0a121f);box-shadow:inset 0 1px #ffffff0a,0 8px 28px #0003}
.shop-front .shop-actions .main-task{background:linear-gradient(125deg,#f6e4bb,#d9b978);color:#102542}.shop-front .shop-actions .main-task small,.shop-front .shop-actions .main-task .shop-icon{color:#284256}
.shop-front .shop-catalog-link{color:#f5f2e9}.shop-front .shop-category-section,.shop-front .shop-public-catalog{border:1px solid #e7cc9126;border-radius:22px;padding:22px;background:linear-gradient(145deg,#101e31aa,#0a121f)}
.shop-front .shop-categories a{border-radius:14px;padding:14px 10px;background:#e7cc9108;min-height:58px}.shop-front .shop-contact,.shop-front .customer-order{border-radius:24px;border:1px solid #e7cc9133;overflow:hidden}
.shop-front .shop-document-links a,.main-tasks .main-task{border-radius:18px}.customer-internal{margin-top:28px;padding:18px;border:1px dashed #e7cc9133;border-radius:18px}.customer-internal summary{min-height:44px;cursor:pointer}
a,button{touch-action:manipulation}button,.button,.main-task,.shop-catalog-link,.shop-categories a{transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}
button:active,.button:active,.main-task:active{transform:scale(.98)}:focus-visible{outline:3px solid #e7cc91!important;outline-offset:4px!important}
@media(hover:hover){.main-task:hover,.shop-catalog-link:hover,.shop-categories a:hover{transform:translateY(-3px);box-shadow:0 12px 32px #0005;border-color:#e7cc9177}}
@keyframes atelier-pulse{50%{opacity:.65}}
@media(max-width:420px){.role-switch a{font-size:12px}.shop-front .shop-category-section,.shop-front .shop-public-catalog{padding:17px}.hero{border-radius:20px}}
@media(max-width:600px){.bottom-nav,body:not(.shop-front) .bottom-nav,.work-dialog::backdrop,.editor-actions{backdrop-filter:none;-webkit-backdrop-filter:none}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}