:root{--atelier-surface:#191d23;--atelier-line:#30353e;--atelier-green:#9bd471}html:not(.dark){--atelier-surface:#fff;--atelier-line:#d6dcd2;--atelier-green:#3d702a}.atelier-frame,.atelier-avatar,.atelier-command,.atelier-status,.atelier-level,[data-atelier-button],.nav-item-main{--atelier-accent:rgb(var(--atelier-rgb,var(--nc,139, 188, 111)));--atelier-edge:color-mix(in srgb, var(--color-background) 60%, var(--atelier-accent));border:1px solid color-mix(in srgb, var(--atelier-line) 55%, var(--atelier-accent));background:var(--atelier-surface);box-shadow:4px 4px 0 var(--atelier-edge);border-radius:10px;transition:translate .2s,border-color .2s,background-color .2s,box-shadow .2s}html:root body :is(.card-glass,.card-premium,.resource-card,.subject-card){--atelier-accent:rgb(var(--atelier-rgb,var(--nc,113, 130, 116)));--atelier-edge:color-mix(in srgb, var(--color-background) 60%, var(--atelier-accent));border-color:color-mix(in srgb, var(--atelier-line) 65%, var(--atelier-accent));background-color:var(--atelier-surface);box-shadow:4px 4px 0 var(--atelier-edge);border-radius:10px}html:root body :is(a.card-glass,button.card-glass,.card-glass-interactive,.card-premium,.resource-card,.subject-card):hover{box-shadow:5px 6px 0 var(--atelier-edge)}.card-premium:before{display:none}.atelier-tile{flex-direction:column;justify-content:center;align-items:flex-start;gap:15px;height:100%;min-height:139px;padding:22px;display:flex}.atelier-tile .atelier-icon-mount{width:49px;height:49px}.atelier-tile .atelier-icon-mount>svg{width:34px;height:34px}.atelier-icon-mount{--atelier-accent:rgb(var(--atelier-rgb,var(--nc,139, 188, 111)));border:1px solid color-mix(in srgb, var(--atelier-accent) 30%, transparent);background:color-mix(in srgb, var(--atelier-accent) 10%, transparent);border-radius:7px;flex:none;justify-content:center;align-items:center;width:34px;height:34px;display:inline-flex;rotate:-6deg}.atelier-icon-mount>svg{rotate:6deg}html:root .nav-item-main{color:var(--color-foreground);background:var(--atelier-surface);box-shadow:4px 4px 0 var(--atelier-edge);border-radius:10px}html:root .nav-item-main:is(.nav-active,[aria-current=page]){background:color-mix(in srgb, var(--atelier-surface) 85%, var(--atelier-accent));border-color:color-mix(in srgb, var(--atelier-accent) 65%, var(--atelier-line))}html:root .nav-item-main:hover{background:color-mix(in srgb, var(--atelier-surface) 92%, var(--atelier-accent));box-shadow:5px 5px 0 var(--atelier-edge);transform:none}html:root .nav-item-main .nav-icon{filter:none}.atelier-menu-list{padding-bottom:6px;padding-right:4px}.atelier-menu-list>li+li{margin-top:11px}.atelier-photo-nav{margin-bottom:4px;margin-right:4px}.atelier-photo-nav[aria-current=page]{border-color:var(--atelier-accent);background:color-mix(in srgb, var(--atelier-surface) 88%, var(--atelier-accent))}.atelier-avatar{color:var(--atelier-green);border-radius:12px;flex:none;rotate:-5deg}.atelier-command{width:44px;height:44px;color:var(--color-foreground);flex:none;justify-content:center;align-items:center;display:inline-flex}.atelier-command>svg{width:25px;height:25px}.atelier-theme-command{--atelier-rgb:157, 131, 231}.atelier-notification-command{--atelier-rgb:220, 181, 87}.atelier-status{padding:8px 12px}.atelier-status .atelier-status-mark{border:1px solid color-mix(in srgb, var(--atelier-green) 30%, transparent);border-radius:7px}.atelier-level{border-color:var(--atelier-line);min-height:44px;color:var(--nav-text);background:color-mix(in srgb, var(--color-background) 70%, var(--atelier-surface));translate:0 2px;box-shadow:inset 0 3px 6px #00000040,inset 0 1px 2px #0000002e}.atelier-level[aria-pressed=true]{z-index:1;border-color:color-mix(in srgb, var(--atelier-accent) 65%, white);color:#12151f;background:linear-gradient(160deg, color-mix(in srgb, var(--atelier-accent) 78%, white), var(--atelier-accent));box-shadow:0 5px 0 color-mix(in srgb, var(--atelier-accent) 55%, #12151f), 0 8px 12px #00000047, inset 0 1px 0 #ffffff73;font-size:14px;translate:0 -3px}html:not(.dark) .atelier-level[aria-pressed=false]{box-shadow:inset 0 2px 5px #212d1924,inset 0 1px 2px #212d191a}[data-atelier-button=default]{background:var(--color-primary);color:var(--color-primary-foreground)}[data-atelier-button=destructive]{--atelier-accent:var(--color-destructive);background:var(--color-destructive);color:var(--color-destructive-foreground)}[data-atelier-button=outline]{color:var(--color-foreground)}.atelier-badge{border-radius:7px}.atelier-badge-card[data-locked=true]{box-shadow:3px 3px 0 var(--atelier-line)}@media (hover:hover) and (pointer:fine){:is(a.atelier-frame,button.atelier-frame,.atelier-command):not(:disabled,[aria-disabled=true]):hover{box-shadow:5px 6px 0 var(--atelier-edge);translate:0 -2px}}:is(a.atelier-frame,button.atelier-frame,a.atelier-avatar,.atelier-command,.atelier-level,[data-atelier-button],.nav-item-main):not(:disabled,[aria-disabled=true]):active{box-shadow:1px 1px 0 var(--atelier-edge);translate:3px 3px}:is(.atelier-frame,.atelier-avatar,.atelier-command,.atelier-level):focus-visible{outline:2px solid var(--color-ring);outline-offset:5px}@media (max-width:639px){.atelier-tile{padding:19px 16px}}@media (prefers-reduced-motion:reduce){.atelier-frame,.atelier-avatar,.atelier-command,.atelier-status,.atelier-level,[data-atelier-button],.nav-item-main{transition:none}html:root body :is(.atelier-frame,.atelier-avatar,.atelier-command,.atelier-level,[data-atelier-button],.nav-item-main,.card-glass,.card-premium,.resource-card,.subject-card):is(:hover,:active){transform:none}}.atelier-badge-card>.atelier-icon-mount{width:64px;height:64px}.atelier-badge-card>.atelier-icon-mount>span{rotate:6deg}p.atelier-status{width:fit-content;max-width:100%;margin-inline:auto}html:root .btn-cta{--atelier-accent:var(--color-primary);--atelier-edge:color-mix(in srgb, var(--color-background) 60%, var(--atelier-accent));border:1px solid color-mix(in srgb, var(--color-primary) 65%, var(--atelier-line));box-shadow:4px 4px 0 var(--atelier-edge);border-radius:10px}html:root .btn-cta:hover{box-shadow:5px 6px 0 var(--atelier-edge);transform:translateY(-2px)}html:root .btn-cta:active{box-shadow:1px 1px 0 var(--atelier-edge);transform:translate(3px,3px)}@media (prefers-reduced-motion:reduce){html:root .btn-cta:is(:hover,:active){transform:none}}
