:root{font-family:IBM Plex Sans,Segoe UI,Helvetica Neue,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0}button,input{font:inherit}.app-shell[data-theme=light]{--bg: #e9eef4;--panel: #ffffff;--panel-soft: #f4f7fb;--ink: #102030;--ink-soft: #556679;--line: #d2dce7;--line-strong: #bcc9d7;--brand: #0f61d9;--brand-ink: #ffffff;--danger: #c64031;--danger-ink: #ffffff;--shadow: 0 8px 20px rgba(16, 32, 48, .08)}.app-shell[data-theme=dark]{--bg: #0f1620;--panel: #172130;--panel-soft: #1f2b3d;--ink: #edf3ff;--ink-soft: #a7b8cc;--line: #2d3b50;--line-strong: #3d4f67;--brand: #80abff;--brand-ink: #091423;--danger: #ef6851;--danger-ink: #190705;--shadow: 0 10px 24px rgba(0, 0, 0, .28)}.app-shell{min-height:100vh;background:var(--bg);color:var(--ink);position:relative}.app-shell__layout{min-height:100vh;width:100%;display:flex}.side-panel{width:290px;flex-shrink:0;border-right:1px solid var(--line);background:var(--panel);padding:16px 14px;display:flex;flex-direction:column;gap:12px}.side-panel__brand{display:flex;flex-direction:column;gap:6px}.eyebrow{margin:0;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft)}.side-panel h1{margin:0;font-size:clamp(22px,2.2vw,30px);line-height:1.15}.side-panel__kpi{margin:0;color:var(--ink-soft);font-size:13px}.side-panel__section{display:flex;flex-direction:column;gap:8px}.side-panel__footer{margin-top:auto;display:flex;flex-direction:column;gap:8px}.side-nav-button{justify-content:flex-start;width:100%;background:var(--panel-soft);color:var(--ink-soft);border-color:var(--line)}.side-nav-button.is-active{background:var(--brand);color:var(--brand-ink);border-color:var(--brand)}.app-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:12px;padding:12px}.app-content{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px}.main-layout{flex:1;min-height:0;display:flex;gap:12px}.workspace,.detail-panel,.activity-feed,.activity-center,.token-panel{background:var(--panel);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow)}.workspace{flex:1;min-width:0;min-height:0;padding:12px;display:flex;flex-direction:column;gap:10px;overflow:hidden}.workspace-action-bar{border:1px solid var(--line);background:var(--panel-soft);border-radius:4px;padding:10px;display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}.workspace-action-bar__title{display:flex;flex-direction:column;gap:3px}.workspace-action-bar__title p{margin:0}.workspace-action-bar__title p:last-child{font-size:12px;color:var(--ink-soft)}.workspace-action-bar__actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.gallery-grid{display:flex;flex-wrap:wrap;align-content:flex-start;gap:10px;overflow:auto;padding-right:4px}.image-card{width:clamp(210px,17vw,300px);border:1px solid var(--line);border-radius:4px;background:var(--panel-soft);color:var(--ink);text-align:left;overflow:hidden;padding:0;display:flex;flex-direction:column}.image-card.is-active{border-color:var(--brand);box-shadow:0 0 0 2px color-mix(in srgb,var(--brand),transparent 72%)}.image-card__preview{height:84px}.image-card__meta{padding:10px;display:flex;flex-direction:column;gap:8px}.image-card__name{font-size:14px;font-weight:700;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.image-card__subline{display:flex;justify-content:space-between;align-items:center;gap:8px;font-size:12px;color:var(--ink-soft)}.detail-panel{width:360px;flex-shrink:0;padding:12px;display:flex;flex-direction:column;gap:12px}.detail-panel h2{margin:0}.detail-panel dl{margin:0;display:flex;flex-direction:column;gap:8px}.detail-panel dl>div{display:flex;flex-direction:column;gap:2px}.detail-panel dt{font-size:11px;text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft)}.detail-panel dd{margin:0}.detail-panel__actions{display:flex;flex-wrap:wrap;gap:8px}.detail-panel .danger{background:var(--danger);color:var(--danger-ink)}.generated-link{display:flex;flex-direction:column;gap:8px}.generated-link label{font-size:12px;color:var(--ink-soft)}.generated-link__row{display:flex;gap:8px}.generated-link input{flex:1}.generated-link__status{margin:0;font-size:12px;color:var(--ink-soft)}.generated-link__status--error{color:var(--danger)}.token-panel{padding:12px;display:flex;flex-direction:column;gap:12px}.token-panel__header{display:flex;justify-content:space-between;align-items:center;gap:8px}.token-panel h2,.token-panel h3{margin:0}.token-panel__intro{margin:0;color:var(--ink-soft)}.token-panel__create{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.token-panel__create label{min-width:120px;color:var(--ink-soft)}.token-panel__create input{flex:1;min-width:210px}.token-panel__created{border:1px solid var(--line-strong);background:var(--panel-soft);padding:10px;border-radius:4px;display:flex;flex-direction:column;gap:8px}.token-panel__created p{margin:0;color:var(--ink-soft)}.token-panel__field{display:flex;flex-direction:column;gap:4px}.token-panel__field>div{display:flex;gap:8px}.token-panel__field input{flex:1}.token-panel__field small{color:var(--ink-soft)}.token-panel__sharex{border:1px solid var(--line);background:var(--panel-soft);border-radius:4px;padding:10px;display:flex;flex-direction:column;gap:8px}.token-panel__sharex-grid{display:flex;flex-direction:column;gap:8px}.token-panel__sharex-grid p{margin:0;border:1px solid var(--line);background:var(--panel);border-radius:4px;padding:8px;display:flex;flex-direction:column;gap:4px;color:var(--ink-soft);font-size:12px}.token-panel__list{display:flex;flex-direction:column;gap:8px}.credential-cards{display:flex;flex-wrap:wrap;gap:8px}.credential-card{width:min(100%,340px);border:1px solid var(--line);border-radius:4px;background:var(--panel-soft);padding:10px;display:flex;flex-direction:column;gap:8px}.credential-card header,.credential-card footer{display:flex;justify-content:space-between;align-items:center;gap:6px}.credential-card p{margin:0;display:flex;flex-direction:column;gap:2px;color:var(--ink-soft);font-size:12px}.credential-card span{color:var(--ink)}.activity-feed{padding:12px;display:flex;flex-direction:column;gap:8px}.activity-feed h2{margin:0}.activity-feed__header{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}.activity-feed__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px}.activity-feed__item{border:1px solid var(--line);background:var(--panel-soft);border-radius:4px;padding:8px;display:flex;align-items:flex-start;gap:8px}.activity-center{padding:12px;display:flex;flex-direction:column;gap:10px}.activity-center__header{display:flex;align-items:center;justify-content:space-between;gap:8px}.activity-center__header h2,.activity-center__header p{margin:0}.activity-center__header>p{font-size:12px;color:var(--ink-soft)}.activity-center__list{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;max-height:58vh;overflow:auto}.activity-feed p{margin:0}.activity-feed time{display:block;margin-top:4px;font-size:12px;color:var(--ink-soft)}.empty-activity{margin:0;color:var(--ink-soft)}.status{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;padding:2px 6px;font-size:11px;text-transform:uppercase;font-weight:700;letter-spacing:.05em}.status--ready{background:color-mix(in srgb,#17b890,transparent 78%);color:color-mix(in srgb,#17b890,#000 35%)}.status--processing{background:color-mix(in srgb,#d1a12f,transparent 80%);color:color-mix(in srgb,#d1a12f,#000 35%)}.status--failed,.status--deleted{background:color-mix(in srgb,var(--danger),transparent 80%);color:var(--danger)}.pill{display:inline-flex;align-items:center;justify-content:center;border-radius:4px;padding:2px 6px;font-size:10px;letter-spacing:.05em;text-transform:uppercase;font-weight:700}.pill--upload{background:color-mix(in srgb,#17b890,transparent 80%)}.pill--share{background:color-mix(in srgb,#d1a12f,transparent 82%)}.pill--delete{background:color-mix(in srgb,var(--danger),transparent 82%)}.pill--credential{background:color-mix(in srgb,#6168d8,transparent 82%)}.auth-chip{margin:0;border:1px solid var(--line);border-radius:4px;padding:8px;background:var(--panel-soft);color:var(--ink-soft);font-size:12px}.icon-label{display:inline-flex;align-items:center;gap:7px}.material-icon{fill:currentColor;flex-shrink:0}code{font-family:IBM Plex Mono,Consolas,monospace;font-size:12px;border:1px solid var(--line);border-radius:3px;padding:2px 5px;background:var(--panel-soft);color:var(--ink)}button{border:1px solid transparent;border-radius:4px;background:var(--brand);color:var(--brand-ink);padding:8px 11px;font-weight:600;cursor:pointer}button:hover{filter:brightness(1.06)}button:disabled{opacity:.58;cursor:not-allowed}.ghost-button{background:transparent;color:var(--ink);border-color:var(--line-strong)}input{border:1px solid var(--line-strong);border-radius:4px;background:var(--panel);color:var(--ink);padding:8px 10px}.error-banner{margin:0;border:1px solid color-mix(in srgb,var(--danger),transparent 64%);background:color-mix(in srgb,var(--danger),transparent 88%);border-radius:4px;color:var(--danger);padding:10px}.app-inline-state{margin:0;border:1px solid var(--line);background:var(--panel-soft);border-radius:4px;color:var(--ink-soft);padding:8px 10px;font-size:13px}.empty-state{margin:0;border:1px dashed var(--line-strong);border-radius:4px;padding:16px;text-align:center;color:var(--ink-soft)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:12;background:#0a0e15a3;display:flex;align-items:center;justify-content:center;padding:12px}.upload-modal{width:min(620px,100%);background:var(--panel);border:1px solid var(--line);border-radius:4px;box-shadow:var(--shadow);padding:12px;display:flex;flex-direction:column;gap:10px}.upload-modal header{display:flex;justify-content:space-between;align-items:center}.upload-modal header h2{margin:0}.upload-modal label{display:flex;flex-direction:column;gap:5px;color:var(--ink-soft);font-size:13px}.upload-modal footer{display:flex;justify-content:flex-end;gap:8px}.form-error{margin:0;color:var(--danger);font-size:13px}.auth-gate{width:min(520px,100%);margin:auto;background:var(--panel);border:1px solid var(--line);border-radius:4px;padding:16px;display:flex;flex-direction:column;gap:10px}.auth-gate h1,.auth-gate p{margin:0}.auth-gate p{color:var(--ink-soft)}.root-drop-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:11;pointer-events:none;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:color-mix(in srgb,var(--brand),transparent 85%);border:2px dashed color-mix(in srgb,var(--brand),transparent 20%)}.root-drop-overlay p,.root-drop-overlay small{margin:0}.root-drop-overlay p{font-size:20px;font-weight:700}.root-drop-overlay small{color:var(--ink-soft)}@media(max-width:1200px){.side-panel{width:260px}.main-layout{flex-direction:column}.detail-panel{width:100%}}@media(max-width:860px){.app-shell__layout{flex-direction:column}.side-panel{width:100%;border-right:0;border-bottom:1px solid var(--line)}.side-panel__section{flex-direction:row;flex-wrap:wrap}.side-panel__footer{margin-top:0;flex-direction:row;flex-wrap:wrap}.workspace-action-bar{flex-direction:column;align-items:stretch}}@media(max-width:600px){.app-main{padding:8px}.image-card{width:100%}.generated-link__row,.token-panel__field>div,.upload-modal footer{flex-direction:column}.token-panel__create{flex-direction:column;align-items:stretch}.token-panel__create label,.token-panel__create input{min-width:0}}
