:root{--app-shell-gutter: 20px;--app-shell-gap: 16px;--app-footer-height: 34px;--app-topbar-offset: 14px;--app-topbar-height: 84px;--app-topbar-control-height: 44px;--mkg-blue-700: #155b8a;--mkg-blue-600: #1d74aa;--mkg-blue-500: #2a92cf;--mkg-blue-050: #edf7fc;--surface-panel: rgba(255, 255, 255, .86);--border-soft: rgba(40, 92, 136, .12);--border-strong: rgba(40, 92, 136, .24);--focus-ring: rgba(42, 146, 207, .18);--text-strong: #1a3448;--text-muted: #5d7488;--danger-bg: rgba(239, 68, 68, .12);--danger-border: rgba(239, 68, 68, .18);--danger-text: #991b1b;color:var(--text-strong);font-family:Segoe UI,Aptos,system-ui,sans-serif;background:radial-gradient(circle at top left,rgba(42,146,207,.2),transparent 24%),radial-gradient(circle at 88% 14%,rgba(21,91,138,.16),transparent 18%),linear-gradient(180deg,#edf5fa,#e7f0f7 42%,#dbe7f0);line-height:1.5;font-synthesis:none;font-weight:400}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;overscroll-behavior-y:none;touch-action:pan-x pan-y}body{min-height:100vh;overflow-x:hidden}button,input{font:inherit}button{border:0;cursor:pointer}button:disabled,input:disabled{cursor:not-allowed;opacity:.62}.app-shell{display:flex;flex-direction:column;gap:var(--app-shell-gap);min-height:100vh;padding-bottom:calc(var(--app-shell-gutter) + var(--app-footer-height) + 10px);padding:var(--app-shell-gutter);position:relative}.app-shell__footer-separator{color:var(--border-strong)}.app-shell__footer-item{white-space:nowrap}.app-shell__body,.workspace-shell,.tile-library,.workspace-preview,.lookup-results{display:grid;gap:12px}.pwa-update-toast{align-items:center;bottom:calc(var(--app-shell-gutter) + 2px);display:grid;gap:10px;left:50%;max-width:min(92vw,540px);padding:14px;position:fixed;transform:translate(-50%);z-index:30}.pwa-update-toast__title{color:var(--text-strong);font-size:.94rem;font-weight:700;margin:0}.pwa-update-toast__actions{display:flex;gap:8px;justify-content:flex-end}.pwa-update-center{gap:10px}.pwa-update-center__row{align-items:baseline;display:flex;gap:10px;justify-content:space-between}.pwa-update-center__row span{color:var(--text-muted)}.top-navbar__user-menu-item[data-has-update=true],.top-navbar__mobile-nav-item[data-has-update=true]{border-color:#2a92cf6b;box-shadow:0 0 0 2px #2a92cf14}.app-shell__body,.workspace-shell,.workspace-shell-library,.tile-library{align-content:start;min-width:0}.login-shell{align-items:center;display:grid;min-height:100vh;overflow:hidden;place-items:center;position:relative}.login-backdrop{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,480px);gap:clamp(32px,4vw,96px);padding:clamp(24px,4vh,64px) clamp(24px,5vw,96px);align-items:center;background:linear-gradient(180deg,#004c84,#004c84cc 48%,#004c8499);height:100%;width:100%}.panel-surface{-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:var(--surface-panel);border:1px solid var(--border-soft);border-radius:28px;box-shadow:0 20px 60px #113a581a}.login-logo{align-self:flex-start;display:block;height:auto;max-width:100%;object-fit:contain;width:clamp(220px,32vw,420px)}.login-card{display:grid;gap:18px;padding:36px;width:100%;max-width:640px;justify-self:end;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:var(--surface-panel);border:1px solid var(--border-soft);border-radius:28px;box-shadow:0 20px 60px #113a5826;position:relative;z-index:1}.login-card-header{display:flex;justify-content:space-between}.settings-button{align-items:center;background:transparent;border:none;border-radius:12px;color:inherit;cursor:pointer;display:flex;font-size:1.25rem;justify-content:center;padding:8px;transition:background-color .15s ease,transform .15s ease}.settings-button:hover{background:#0000000d}.settings-button:active{transform:scale(.96)}.settings-button svg{display:block}.login-content{align-items:flex-start;display:flex;flex-direction:column;gap:32px;justify-content:center;color:#fff;min-width:0;position:relative;z-index:1}.login-content h1{font-size:clamp(3rem,6vw,5rem);line-height:1;margin:0}.login-content p{font-size:1.2rem;opacity:.9;max-width:600px}@media (max-width: 1024px){.login-shell{overflow-y:auto}.login-backdrop{gap:24px;min-height:100dvh;grid-template-columns:1fr;align-content:start;padding:clamp(16px,3.2vh,28px) clamp(14px,3.5vw,24px)}.login-card{max-width:none;justify-self:stretch}.pwa-update-toast{width:min(94vw,560px)}}.auth-gate-copy{max-width:34rem}.login-card h1,.tile-library-title,.top-navbar__brand-title{color:var(--text-strong);line-height:1.05;margin:0}.login-card p,.section-copy,.tile-copy,.lookup-item span,.lookup-status,.status-line{color:var(--text-muted);margin:0}.section-copy.compact,.status-line,.error-banner.compact{font-size:.92rem}.top-navbar{height:var(--app-topbar-height);overflow:hidden;padding:0 18px;position:sticky;top:var(--app-topbar-offset);z-index:20}@media (max-width: 768px){.top-navbar{position:relative}}@media (max-height: 750px){.top-navbar{position:relative}}.top-navbar__inner{align-items:center;display:grid;gap:12px 16px;grid-template-columns:minmax(0,1fr) auto;height:100%}.top-navbar__inner--mobile{display:none}.top-navbar__brand-group{align-items:flex-start;display:flex;gap:10px;min-width:0}.top-navbar__brand-lockup,.top-navbar__actions{align-items:center;display:flex;gap:12px;min-width:0}.top-navbar__brand-stack{display:grid;gap:2px;min-width:0}.top-navbar__brand-lockup{background:none;border:0;color:inherit;cursor:pointer;font:inherit;padding:0;text-align:left}.top-navbar__logo{display:block;flex:0 0 auto;height:40px;object-fit:contain;width:auto}.top-navbar__brand-copy{display:grid;gap:2px;min-width:0}.top-navbar__brand-title,.top-navbar__brand-context{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-navbar__brand-title{font-size:1.18rem}.top-navbar__context-info{display:grid;gap:2px;max-width:min(44vw,28rem)}.top-navbar__context-info-button{background:none;border:0;border-radius:10px;color:var(--text-muted);cursor:pointer;display:inline-flex;font:inherit;min-height:24px;padding:2px 6px;text-align:left}.top-navbar__context-info-button:hover{background:#edf7fcb3;color:var(--text-strong)}.top-navbar__context-info-button:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}.top-navbar__context-info-label{font-size:.78rem;font-weight:600;line-height:1.2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-content:center}.top-navbar__context-version{color:var(--text-muted);font-size:.68rem;line-height:1.2;padding:0 6px}.top-navbar__brand-context,.top-navbar__divider{color:var(--text-muted)}.top-navbar__actions{gap:8px;justify-content:flex-end}.top-navbar__actions .ghost-button,.top-navbar__user-info{min-height:var(--app-topbar-control-height)}.top-navbar__button_box,.top-navbar__actions{align-items:stretch}.top-navbar__button_box{display:flex;gap:8px;min-width:0}.top-navbar__mobile-nav{display:none}.top-navbar__user-info,.top-navbar__logout-button{border-radius:16px}.top-navbar__user-info{align-items:center;background:#ffffffb8;border:1px solid var(--border-soft);display:grid;gap:10px;grid-auto-flow:column;justify-content:start;min-width:0;padding:.55rem 1rem}.top-navbar__user-info span{font-size:.8rem;color:var(--text-muted)}.top-navbar__user-menu-trigger{cursor:pointer}.top-navbar__user-menu{border:1px solid var(--border-soft);border-radius:12px;display:grid;min-width:14rem;overflow:hidden}.top-navbar__user-menu-item{align-items:center;background:#fffffff2;border:0;color:var(--text-strong);cursor:pointer;display:inline-flex;gap:10px;justify-content:flex-start;padding:.7rem .84rem;width:100%}.top-navbar__user-menu-item:hover{background:#edf7fcf2}.top-navbar__settings-form{display:grid;gap:12px}.top-navbar__settings-field{display:grid;gap:5px}.top-navbar__settings-field span{color:var(--text-muted);font-size:.76rem;font-weight:700;text-transform:uppercase}.top-navbar__user-info-copy{display:grid;gap:2px;min-width:0}.top-navbar__user-avatar{border-radius:inherit;height:32px;object-fit:cover;width:32px}.top-navbar__user-info-copy strong{color:var(--text-strong);font-size:.92rem;line-height:1.1;text-align:left}.top-navbar__user-info-copy span{color:var(--text-muted);font-size:.8rem;line-height:1.1;text-align:left}.top-navbar__logout-button{color:var(--danger-text);justify-content:flex-start}.top-navbar__mobile-action-label{display:none}.ghost-button--active{background:#2a92cf24;box-shadow:inset 0 0 0 1px #2a92cf2e}.primary-button,.ghost-button,.mode-button,.tile-card,.lookup-item{transition:transform .14s ease,box-shadow .14s ease,background-color .14s ease,border-color .14s ease,color .14s ease}.primary-button,.ghost-button,.mode-button{align-items:center;border-radius:16px;display:inline-flex;font-weight:700;gap:10px;justify-content:center;padding:.84rem 1.05rem}.ghost-button,.mode-button,.lookup-item,.tile-info-button{border:1px solid var(--border-soft)}.primary-button{background:linear-gradient(135deg,var(--mkg-blue-600) 0%,var(--mkg-blue-500) 100%);box-shadow:0 16px 32px #1d74aa3d;color:#f4fbff}.primary-button.small{padding:.72rem .92rem}.button-icon{flex:0 0 auto;font-size:1rem}.ghost-button,.mode-button{background:#ffffffbd;color:var(--text-strong)}.top-navbar__button_box{display:flex;gap:8px}.top-navbar__brand-lockup--mobile{align-items:center;display:inline-flex;gap:10px}.top-navbar__brand-copy--mobile{gap:1px}.top-navbar__brand-title--mobile{font-size:1rem}.top-navbar__logo--mobile{height:30px}.top-navbar__mobile-subtitle{color:var(--text-muted);display:block;font-size:.74rem;line-height:1.2;max-width:min(56vw,16rem);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-navbar__mobile-menu-trigger{min-height:44px;min-width:44px;padding:0}.top-navbar__mobile-drawer{border-top-left-radius:18px;border-bottom-left-radius:18px;display:flex;flex-direction:column;height:100dvh;max-width:min(86vw,360px);width:min(86vw,360px)}.top-navbar__mobile-drawer-backdrop{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.top-navbar__mobile-drawer-content{display:flex;flex-direction:column;flex:1 1 auto;gap:8px;min-height:0;padding:calc(14px + env(safe-area-inset-top,0px)) 10px calc(16px + env(safe-area-inset-bottom,0px))}.top-navbar__mobile-nav-list{display:grid;gap:4px;overflow-y:auto}.top-navbar__mobile-footer{background:color-mix(in srgb,var(--surface-panel) 78%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-top:1px solid var(--border-soft);bottom:0;display:grid;gap:8px;margin-top:auto;padding:16px 0 calc(4px + env(safe-area-inset-bottom,0px));position:sticky;z-index:1}.top-navbar__mobile-user-row{align-items:center;background:transparent;border:0;border-radius:8px;color:inherit;display:grid;gap:8px;grid-template-columns:auto minmax(0,1fr);min-height:40px;padding:0;text-align:left}.top-navbar__mobile-user-row:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}.top-navbar__mobile-user-avatar{align-items:center;border:1px solid var(--border-soft);border-radius:999px;display:inline-flex;height:32px;justify-content:center;width:32px}.top-navbar__mobile-user-avatar .button-icon{color:var(--text-muted);font-size:.95rem}.top-navbar__mobile-user-avatar img{border-radius:inherit;height:100%;object-fit:cover;width:100%}.top-navbar__mobile-user-copy{display:grid;gap:1px;min-width:0}.top-navbar__mobile-user-copy strong,.top-navbar__mobile-user-copy span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-navbar__mobile-user-copy strong{color:var(--text-strong);font-size:.88rem;font-weight:600;line-height:1.2}.top-navbar__mobile-user-copy span{color:var(--text-muted);font-size:.74rem;line-height:1.15}.top-navbar__mobile-version-text{align-items:baseline;column-gap:8px;color:var(--text-muted);display:inline-flex;flex-wrap:wrap;font-size:.72rem;line-height:1.2;margin:0}.top-navbar__mobile-version-label{color:color-mix(in srgb,var(--text-muted) 84%,transparent);font-weight:500}.top-navbar__mobile-version-value{color:color-mix(in srgb,var(--text-strong) 88%,transparent);font-weight:600;letter-spacing:.01em}.server-clock{display:grid;gap:2px}.server-clock__label{color:color-mix(in srgb,var(--text-muted) 84%,transparent);font-size:.68rem;font-weight:500;line-height:1.15}.server-clock__unix,.server-clock__localized{color:var(--text-muted);font-size:.72rem;line-height:1.15}.top-navbar__mobile-nav-item{align-items:center;background:#fffc;border:1px solid var(--border-soft);border-radius:12px;color:var(--text-strong);display:grid;gap:1px 7px;grid-template-columns:auto minmax(0,1fr);min-height:42px;padding:8px 10px;text-align:left}.top-navbar__mobile-nav-item span,.top-navbar__mobile-nav-item small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.top-navbar__mobile-nav-item span{font-size:.86rem;font-weight:700;line-height:1.2}.top-navbar__mobile-nav-item small{color:var(--text-muted);font-size:.7rem;grid-column:2;line-height:1.15}.top-navbar__mobile-nav-item .button-icon{font-size:.95rem;grid-row:1 / span 2}.top-navbar__mobile-nav-item--danger{color:var(--danger-text)}.top-navbar__menu-button{background:#edf7fcf2;color:var(--mkg-blue-700)}@media (max-width: 1080px){.top-navbar{padding:0 12px}.top-navbar__inner{gap:10px}}@media (max-width: 900px){.top-navbar__brand-title{font-size:1.05rem}.top-navbar__user-info{padding:.5rem .75rem}.top-navbar__user-info-copy{max-width:8rem}.top-navbar__inner--desktop .top-navbar__actions .ghost-button{padding:.62rem .72rem}}@media (max-width: 768px){:root{--app-shell-gutter: 12px;--app-shell-gap: 16px;--app-topbar-height: 62px;--app-topbar-offset: 10px}.top-navbar{padding:0 10px}.top-navbar__inner--desktop{display:none}.top-navbar__inner--mobile{align-items:center;display:grid;gap:10px;grid-template-columns:minmax(0,1fr) auto}.top-navbar__mobile-drawer{max-width:min(90vw,360px);width:min(90vw,360px)}.pwa-update-toast{bottom:12px;gap:8px;left:50%;padding:12px}.pwa-update-toast__actions{justify-content:stretch}.pwa-update-toast__actions .primary-button,.pwa-update-toast__actions .ghost-button{flex:1 1 0}.top-navbar__mobile-subtitle{max-width:min(58vw,15rem)}}@media (max-width: 480px){.top-navbar{padding:0 6px}.top-navbar__inner--mobile{gap:8px}.top-navbar__mobile-subtitle{max-width:min(54vw,11rem)}.top-navbar__mobile-drawer{max-width:min(94vw,360px);width:min(94vw,360px)}}.ghost-button:hover,.mode-button:hover,.lookup-item:hover,.tile-card:hover,.primary-button:hover{box-shadow:0 12px 24px #1d74aa1f;transform:translateY(-1px)}.ghost-button:hover,.mode-button:hover,.lookup-item:hover,.tile-card:hover{border-color:#2a92cf57}.mode-button.is-active{background:linear-gradient(135deg,var(--mkg-blue-700) 0%,var(--mkg-blue-600) 100%);border-color:transparent;box-shadow:0 12px 24px #155b8a29;color:#f3fbff}.primary-button:focus-visible,.ghost-button:focus-visible,.mode-button:focus-visible,.lookup-item:focus-visible,.tile-info-button:focus-visible{box-shadow:0 0 0 4px var(--focus-ring);outline:none}.login-form{display:flex;flex-direction:column;gap:14px}.login-form label{display:flex;flex-direction:column;gap:6px;width:100%}.login-field-input{align-items:center;display:flex;position:relative;width:100%}.login-field-input.has-icon input{padding-left:2.6rem}.login-field-input.has-action input{padding-right:3rem}.field-input-icon{align-items:center;color:#155b8ac7;display:inline-flex;height:1.25rem;justify-content:center;left:.82rem;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);width:1.25rem}.field-input-icon svg{height:1rem;width:1rem}.field-action-button{align-items:center;background:transparent;border:none;border-radius:999px;color:var(--mkg-blue-700);display:inline-flex;height:2.1rem;justify-content:center;padding:0;position:absolute;right:.48rem;top:50%;transform:translateY(-50%);width:2.1rem}.field-action-button:hover{background:#2a92cf1f}.field-action-button:focus-visible{box-shadow:0 0 0 3px var(--focus-ring);outline:none}.field-action-button svg{font-size:1.12rem}.server-status-indicator{align-items:center;display:inline-flex;height:2.1rem;justify-content:center;position:absolute;right:.6rem;top:50%;transform:translateY(-50%);width:2.1rem}.server-status-dot{border-radius:999px;display:inline-block;height:.68rem;width:.68rem}.server-status-dot.is-checking{animation:server-status-pulse 1s ease-in-out infinite;background:#f59e0b}.server-status-dot.is-reachable{background:#22c55e}.server-status-dot.is-unreachable,.server-status-dot.is-idle{background:#ef4444}@keyframes server-status-pulse{0%{opacity:.5;transform:scale(.92)}50%{opacity:1;transform:scale(1)}to{opacity:.5;transform:scale(.92)}}.login-form span{color:var(--mkg-blue-700);font-size:.8rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.login-form input,.workspace-compact-input{background:#fffffff5;border:1px solid var(--border-soft);border-radius:18px;color:var(--text-strong);min-width:0;outline:none;padding:.92rem 1rem;width:100%;transition:border-color .14s ease,box-shadow .14s ease,transform .14s ease}.login-form input:focus,.workspace-compact-input:focus,.tile-face-front:focus-visible{border-color:var(--mkg-blue-500);box-shadow:0 0 0 4px var(--focus-ring);outline:none}.error-banner{background:var(--danger-bg);border:1px solid var(--danger-border);border-radius:18px;color:var(--danger-text);padding:.9rem 1rem}.error-banner.compact{border-radius:14px;padding:.7rem .82rem}button.refresh-button{border-radius:20px;display:flex;gap:10px;color:#00008b}.workspace-toolbar,.workspace-preview{padding:12px}.workspace-toolbar{align-items:flex-start;display:flex;flex-wrap:wrap;gap:10px;overflow:visible;position:relative;z-index:2}.workspace-mode-strip{display:inline-flex;flex-wrap:wrap;gap:6px}.workspace-entry{flex:1 1 300px;max-width:34rem;min-width:min(100%,300px)}.workspace-toolbar .ghost-button,.workspace-toolbar .mode-button,.workspace-toolbar .primary-button.small{border-radius:14px;padding:.68rem .86rem}.workspace-input-form{align-items:center;display:flex;gap:8px;margin-left:auto;min-width:0}.workspace-compact-input{flex:1 1 auto;padding:.72rem .88rem}.workspace-lookup-picker{max-height:min(22rem,60vh);overflow:auto;padding:10px;position:fixed;z-index:90}.workspace-preview{overflow:visible;position:relative;z-index:1}.lookup-status{font-size:.92rem;padding:.2rem .15rem .5rem}.lookup-item,.tile-topline{display:flex;flex-direction:column;gap:4px;position:relative;text-align:left;z-index:1}.lookup-item{background:#ffffffdb;border-radius:14px;padding:.74rem .82rem}.lookup-item.is-active{background:var(--mkg-blue-050);border-color:#2a92cf5c}.scanner-panel{display:grid;gap:12px}.scanner-panel__viewport{align-items:center;background:linear-gradient(145deg,#155b8a1f,#2a92cf14);border:1px solid var(--border-soft);display:grid;justify-items:center;min-height:16rem;overflow:hidden;position:relative}.scanner-panel__viewport.is-active{background:#08141c}.scanner-panel__video{display:block;height:100%;max-height:24rem;object-fit:cover;width:100%}.scanner-panel__empty{color:var(--text-muted);display:grid;font-weight:600;top:0;right:0;bottom:0;left:0;padding:1rem;place-content:center;position:absolute;text-align:center}.scanner-panel__empty-content{display:grid;gap:12px;justify-items:center;max-width:18rem}.scanner-panel__actions{align-items:center;display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between}.scanner-panel__actions .ghost-button{min-height:42px}.lookup-item strong,.tile-topline strong,.tile-back-title{color:var(--text-strong);font-weight:700}.tile-library{gap:18px}.tile-library-title{font-size:clamp(1.4rem,2.6vw,2rem)}.tile-status{align-items:center;display:inline-flex;gap:10px;min-height:1.5rem}.spinner-loader{animation:spin .92s linear infinite;border:2px solid rgba(42,146,207,.2);border-radius:999px;border-top-color:var(--mkg-blue-600);display:inline-block;height:18px;width:18px}@keyframes spin{to{transform:rotate(360deg)}}.sandbox-translations-snackbar{align-items:center;background:#14181feb;border-radius:10px;top:20px;box-shadow:0 8px 24px #0f172a40;color:#fff;display:inline-flex;font-size:.85rem;gap:10px;left:50%;padding:10px 16px;position:fixed;transform:translate(-50%);z-index:1300}.sandbox-translations-snackbar .spinner-loader{border-color:#ffffff40;border-top-color:#fff}.tile-stack{display:grid;gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}@media (min-width: 900px){.tile-stack{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (min-width: 1320px){.tile-stack{grid-template-columns:repeat(auto-fit,minmax(15rem,1fr))}.tile-stack.is-sparse{grid-template-columns:repeat(auto-fit,minmax(15rem,18rem))}}.tile-card{aspect-ratio:1;background:linear-gradient(180deg,#ffffffd6,#f1f8fcc7);border:1px solid rgba(42,146,207,.12);border-radius:22px;color:inherit;container-type:inline-size;overflow:hidden;position:relative;text-align:left;width:100%}.tile-card.is-locked{background:linear-gradient(180deg,#f5f7f9f5,#ecf0f3f5);border-color:#788b9c47}.tile-card-inner{height:100%;position:relative;transform-style:preserve-3d;transition:transform .28s ease;width:100%}.tile-card.is-flipped .tile-card-inner{transform:rotateY(180deg)}.tile-face{backface-visibility:hidden;background:linear-gradient(180deg,#ffffffeb,#f4f9fce6);display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100%;top:0;right:0;bottom:0;left:0;padding:14px;position:absolute;width:100%;display:flex;align-items:flex-start;flex-direction:column}.tile-face-front{gap:0;visibility:visible}.tile-face-back{gap:14px;transform:rotateY(180deg);visibility:hidden}.tile-card.is-flipped .tile-face-front{visibility:hidden}.tile-card.is-flipped .tile-face-back{visibility:visible}.tile-card-footer,.tile-primary-surface,.tile-copy-block,.tile-back-content{display:flex}.tile-card-footer{align-items:center;justify-content:space-between}.tile-badge{position:absolute;left:5px;top:5px;background:#00ff001f;border-radius:999px;font-size:.76rem;font-weight:700;gap:4px;letter-spacing:.04em;padding:.38rem .74rem;display:flex;align-items:center;border:1px solid rgba(42,146,207,.18)}.tile-face-front__actions{display:inline-flex;gap:6px;position:absolute;right:clamp(10px,4cqi,14px);top:clamp(10px,4cqi,14px);z-index:3}.tile-card-footer{gap:10px;flex-wrap:wrap;justify-content:flex-start}.tile-primary-surface{align-items:center;background:transparent;border:0;border-radius:0;box-shadow:none;color:inherit;flex:1 1 auto;flex-direction:column;gap:clamp(10px,4cqi,14px);justify-content:center;min-height:0;padding:clamp(6px,2.6cqi,10px) clamp(6px,2.6cqi,10px) 4px;width:100%}.tile-action-button{align-items:center;background:#ffffffe0;border:1px solid rgba(42,146,207,.12);border-radius:16px;color:var(--text-strong);display:inline-flex;gap:8px;justify-content:center;min-height:42px;padding:.78rem .92rem;transition:transform .14s ease,box-shadow .14s ease,border-color .14s ease,background-color .14s ease}.tile-action-button:hover{box-shadow:0 14px 24px #184e751f;transform:translateY(-1px)}.tile-action-button:disabled{background:#e3eaefe6;border-color:#788b9c3d;box-shadow:none;color:#4c6073cc;cursor:not-allowed;transform:none}.tile-action-button:focus-visible,.tile-primary-surface:focus-visible{box-shadow:0 0 0 4px var(--focus-ring);outline:none}.tile-action-button--primary{background:linear-gradient(135deg,var(--mkg-blue-600),var(--mkg-blue-500));border-color:transparent;color:#f8fcff;flex:1 1 auto}.tile-action-button--ghost{background:#e6f2faf5;color:var(--mkg-blue-700)}.tile-action-button--compact{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;gap:0;min-height:clamp(28px,12cqi,34px);min-width:clamp(28px,12cqi,34px);padding:0}.tile-action-button--compact svg{height:clamp(13px,5.5cqi,16px);width:clamp(13px,5.5cqi,16px)}.tile-action-button--compact.tile-action-button--ghost{background:#eaf3f9f0}.tile-action-button--react{background:#e6f8fff0;color:#0f7aa5}.tile-action-button--utility{color:var(--mkg-blue-700);padding-inline:.78rem}.tile-action-button svg{fill:currentColor;flex:0 0 auto;height:16px;width:16px}.tile-copy-block,.tile-back-content{flex:0 1 auto;flex-direction:column;gap:8px;min-height:0}.tile-copy-block{justify-content:center}.tile-primary-surface:disabled{cursor:not-allowed}.tile-card.is-locked .tile-primary-surface,.tile-card.is-locked .tile-copy-block,.tile-card.is-locked .tile-visual-image,.tile-card.is-locked .tile-visual-frame svg,.tile-card.is-locked .tile-visual-placeholder,.tile-card.is-locked .tile-topline strong{filter:grayscale(1);opacity:.74}.tile-card.is-locked .tile-face{background:linear-gradient(180deg,#f7fafcf2,#eef2f6f2)}.tile-lock-icon,.tile-lock-inline{align-items:center;color:#5b6f82;display:inline-flex;font-size:.76rem;font-weight:700;gap:6px;letter-spacing:.03em}.tile-lock-icon{border-radius:999px;padding:4px 10px;position:absolute;right:12px;bottom:12px;z-index:4}.tile-lock-inline{justify-content:center}.tile-lock-icon svg,.tile-lock-inline svg{height:14px;width:14px}.tile-back-content{justify-content:flex-start;overflow:hidden}.tile-topline{align-items:center;display:flex;min-height:0;text-align:center;width:100%}.tile-topline strong{display:block;font-size:clamp(.98rem,4.8cqi,1.1rem);line-height:1.3;overflow-wrap:anywhere;width:100%}.tile-visual{align-items:center;display:flex;flex:0 0 auto;justify-content:center;min-height:0;z-index:1}.tile-visual-frame{align-items:center;align-self:stretch;background:transparent;display:flex;height:clamp(88px,42cqi,118px);justify-content:center;max-width:100%;padding:clamp(6px,3cqi,10px);width:100%}.tile-visual-frame--empty{background:linear-gradient(135deg,#2a92cf1f,#155b8a2e);border-color:#2a92cf2e}.tile-visual-placeholder{color:#155b8a9e;font-size:clamp(.92rem,4.8cqi,1.12rem);font-weight:800;letter-spacing:.14em}.tile-visual-image,.tile-visual-frame svg{display:block;height:100%;max-height:100%;max-width:100%;object-fit:contain;object-position:center;width:100%}.tile-visual-frame svg{fill:#155b8a73}.editor-overlay{align-items:stretch;background:#06101c66;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:flex;top:0;right:0;bottom:0;left:0;justify-content:center;overflow:hidden;padding:30px;position:fixed;z-index:40}.editor-shell{background:linear-gradient(180deg,#0f172afa,#0d121ffa),linear-gradient(135deg,rgba(42,146,207,.18),transparent 38%);border:1px solid rgba(148,163,184,.18);border-radius:26px;box-shadow:0 28px 70px #0f172a57;color:#d7e3f4;display:grid;gap:18px;grid-template-rows:auto minmax(0,1fr);max-width:min(100%,1440px);min-height:0;padding:22px;width:100%}.editor-shell__header,.editor-shell__header-copy,.editor-shell__meta,.editor-tab,.editor-shell__activity-rail{display:flex}.editor-shell__header,.editor-shell__meta{align-items:center;justify-content:space-between}.editor-shell__header-copy{flex-direction:column;gap:6px}.editor-shell__title{font-size:clamp(1.1rem,2vw,1.4rem);line-height:1.1}.editor-shell .section-copy,.editor-shell .status-line{color:#cbd5e1c2}.editor-shell__close{background:#0f172ad1;border:1px solid rgba(148,163,184,.18);color:#e2e8f0}.editor-shell__status{align-items:center;background:#0f172a7a;border:1px solid rgba(148,163,184,.14);border-radius:20px;display:flex;justify-content:center;min-height:min(70vh,720px)}.editor-shell .error-banner{background:#7f1d1d5c;border-color:#f8717147;color:#fecaca}.editor-shell__workbench{background:#0206176b;border:1px solid rgba(148,163,184,.14);border-radius:22px;display:grid;gap:0;grid-template-columns:58px minmax(0,1fr);min-height:0;overflow:hidden}.editor-shell__activity-rail{align-items:center;background:linear-gradient(180deg,#0b111efa,#0f172afa);flex-direction:column;gap:14px;justify-content:flex-start;padding:18px 0}.editor-rail-indicator{align-items:center;border-left:2px solid transparent;color:#94a3b8b8;display:flex;justify-content:center;min-height:44px;width:100%}.editor-rail-indicator.is-active{border-left-color:#60a5fa;color:#e2e8f0}.editor-shell__editor-pane{display:grid;grid-template-rows:auto auto minmax(0,1fr);min-height:0;min-width:0}.editor-shell__meta,.editor-tabbar{background:#0f172ad6;border-bottom:1px solid rgba(148,163,184,.12);padding:10px 14px}.editor-shell__meta{gap:12px}.editor-shell__meta-copy{display:grid;gap:2px}.editor-shell__meta-copy strong{font-size:.92rem}.editor-shell__meta-copy span,.editor-tabbar__meta{color:#94a3b8cc;font-size:.84rem}.editor-chip{background:#2563eb29;border:1px solid rgba(96,165,250,.22);border-radius:999px;color:#bfdbfe;font-size:.8rem;font-weight:700;letter-spacing:.02em;padding:.34rem .62rem}.editor-tabbar{align-items:center;display:flex;gap:12px;justify-content:space-between}.editor-tabbar__tabs{display:flex;gap:2px;min-width:0}.editor-tab{align-items:center;background:transparent;border:0;border-radius:12px 12px 0 0;color:#94a3b8cc;cursor:pointer;font:inherit;gap:10px;min-width:0;padding:.72rem .96rem}.editor-tab.is-active{background:#1e293bf0;color:#f8fafc}.editor-tab span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.editor-pane__surface{min-height:0}.editor-review__surface{min-height:0;overscroll-behavior:contain;overflow:auto}.editor-pane__surface .monaco-editor,.editor-pane__surface .monaco-editor-background,.editor-pane__surface .margin{background-color:#0f172a}.code-review{background:#0f172af5;border-top:1px solid rgba(148,163,184,.16);color:#d7e3f4;display:grid;gap:12px;min-height:100%;overflow:visible;padding:14px}.code-review__header,.code-review__header>div,.code-review__status,.code-review__summary,.code-review__issue-meta,.code-review--pending,.code-review--error{align-items:center;display:flex}.code-review__header,.code-review__summary{justify-content:space-between}.code-review__header>div{align-items:flex-start;flex-direction:column;gap:3px}.code-review__header>div span,.code-review__issue-meta{color:#cbd5e1b8;font-size:.8rem}.code-review__status,.code-review__summary span,.code-review__severity{border:1px solid rgba(148,163,184,.24);border-radius:999px;font-size:.78rem;font-weight:700;padding:.3rem .52rem}.code-review__status{gap:6px}.code-review__status.is-passed{background:#16a34a24;color:#86efac}.code-review__status.is-failed,.code-review__severity{background:#fbbf241f;color:#fde68a}.code-review__issues{display:grid;gap:8px;list-style:none;margin:0;padding:0}.code-review__issue{background:#1e293bc2;border-left:3px solid #fbbf24;padding:10px}.code-review__issue.is-error{border-left-color:#f87171}.code-review__issue-meta{gap:8px}.code-review__issue p{color:#e2e8f0;margin:7px 0 0}.code-review--pending,.code-review--error{gap:8px}.code-review--error{color:#fde68a}.tile-back-title{margin:0}.tile-face-back__title{color:var(--text-strong);font-size:.92rem}.tile-copy-scroll{flex:1 1 auto;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;padding-right:4px}.layout-frame{background:#fff;border:1px solid var(--border-strong);border-radius:18px;display:block;min-height:min(70vh,32rem);overflow:hidden;position:relative;width:100%}.component-library-shell{min-width:0}.component-library__category-row{display:flex;flex-wrap:wrap;gap:12px}.component-library__stats{color:var(--text-muted);font-size:.95rem}.component-library__grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}.component-library-card{display:grid;gap:18px;min-width:0;padding:22px}.component-library-card__header{display:grid;gap:10px}.component-library-card__category{color:var(--mkg-blue-700);font-size:.75rem;font-weight:700;letter-spacing:.08em;margin-bottom:6px;text-transform:uppercase}.component-library-card__title{margin:0}.component-library-card__description{color:var(--text-muted);margin:0}.component-library-card__preview{background:linear-gradient(180deg,#ffffffb8,#edf7fce6);border:1px solid var(--border-soft);border-radius:20px;min-height:140px;min-width:0;overflow:hidden;padding:18px}.component-library-card__preview>*{max-width:100%;min-width:0}.component-library-card__notes{display:grid;gap:12px}.component-library-card__usage,.component-library-card__highlights{display:grid;gap:6px}.component-library-card__usage strong,.component-library-card__highlights strong{color:var(--text-strong);font-size:.82rem;letter-spacing:.04em;text-transform:uppercase}.component-library-card__usage p,.component-library-card__highlights ul{color:var(--text-muted);margin:0}.component-library-card__highlights ul{padding-left:1.1rem}.component-library-card__highlights li+li{margin-top:4px}.component-library-card__code{background:#162a3cf5;border-radius:18px;color:#e6f4ff;font-family:Consolas,SFMono-Regular,monospace;font-size:.86rem;margin:0;min-width:0;overflow-x:auto;padding:16px;white-space:pre-wrap;word-break:break-word}.component-library__spinner-preview{align-items:center;display:flex;justify-content:center;min-height:104px}.component-library__layout-preview,.component-library__pull-preview{max-width:100%;min-width:0}.component-library__pull-preview>*{border:1px solid rgba(148,163,184,.25);border-radius:18px;max-width:100%;min-width:0}.component-library__layout-preview>*{max-width:100%;min-width:0}@media (min-width: 769px) and (max-width: 960px){:root{--app-topbar-height: 100px}.editor-overlay{padding:14px}.editor-shell{border-radius:20px;padding:14px}.editor-shell__header,.editor-shell__meta,.editor-tabbar{align-items:flex-start;flex-direction:column}.editor-shell__workbench{grid-template-columns:48px minmax(0,1fr);min-height:min(78vh,860px)}.top-navbar__nav{justify-content:flex-start}}@media (max-width: 720px){:root{--app-shell-gutter: 12px;--app-shell-gap: 16px;--app-topbar-height: 62px;--app-topbar-offset: 10px}.login-shell{padding:0}.login-content{gap:20px}.login-content h1{font-size:clamp(2.1rem,11vw,3.25rem)}.login-content p{font-size:1rem;max-width:none}.login-logo{width:min(78vw,320px)}.login-card,.workspace-toolbar,.workspace-preview{padding:16px}}@media (max-width: 768px){.top-navbar{padding:0 14px}}@media (max-width: 720px){.top-navbar__brand-title-row{gap:4px}.top-navbar__divider{display:none}.top-navbar__menu-button,.top-navbar__logout-button,.top-navbar__user-info{min-height:42px;padding-inline:.88rem}.top-navbar__user-info-copy{display:none}.workspace-input-form{align-items:stretch;flex-direction:column;margin-left:0}.workspace-entry{flex-basis:100%;max-width:none;min-width:100%}.workspace-input-form .primary-button.small{width:100%}.tile-library{gap:10px}.tile-card{aspect-ratio:auto;min-height:18.5rem}.tile-face{padding:12px}.tile-stack{gap:14px;grid-template-columns:repeat(2,minmax(0,1fr))}.tile-visual-frame{height:96px;padding:6px}.layout-frame{min-height:min(60vh,24rem)}.component-library-card{padding:18px}.component-library-card__preview,.component-library-card__code{border-radius:16px}}@media (max-width: 560px){:root{--app-topbar-height: 62px}.layout-frame{min-height:min(56vh,21.5rem)}.tile-card-footer{width:100%}.tile-card-footer{flex-wrap:wrap}.tile-action-button--primary,.tile-action-button--ghost,.tile-action-button--utility{flex:1 1 100%}.tile-library-title{font-size:clamp(1.25rem,7vw,1.6rem)}.tile-stack{gap:10px;grid-template-columns:repeat(2,minmax(0,1fr))}.tile-card{aspect-ratio:1;border-radius:16px;min-height:0}.tile-face{padding:clamp(8px,5cqi,10px)}.tile-primary-surface{gap:clamp(5px,4cqi,8px);padding:clamp(4px,3cqi,7px) clamp(3px,2.5cqi,6px) 2px}.tile-face-front:has(.tile-face-front__actions) .tile-primary-surface{padding-top:clamp(26px,19cqi,32px)}.tile-face-front__actions{gap:4px;right:clamp(7px,5cqi,9px);top:clamp(7px,5cqi,9px)}.tile-action-button--compact{min-height:clamp(24px,18cqi,30px);min-width:clamp(24px,18cqi,30px)}.tile-action-button--compact svg{height:clamp(12px,8cqi,15px);width:clamp(12px,8cqi,15px)}.tile-visual-frame{height:clamp(48px,40cqi,84px);padding:clamp(3px,3cqi,5px)}.tile-copy-block{gap:4px;width:100%}.tile-topline strong{display:-webkit-box;font-size:clamp(.78rem,8.5cqi,.98rem);line-height:1.18;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}.tile-lock-icon{bottom:7px;padding:3px 7px;right:7px}.component-library-shell{min-width:0}.component-library__grid{gap:12px;grid-template-columns:1fr}.component-library-card{gap:12px;padding:14px}.component-library-card__preview{min-height:112px;padding:12px}.component-library-card__code{padding:12px}.component-library__category-row{gap:8px}.component-library__category-row>*{flex:1 1 calc(50% - 8px);min-width:0}}@media (max-width: 480px){.workspace-preview{padding:8px}.layout-frame{border-radius:14px;min-height:min(52vh,19rem)}.component-library-shell h2{font-size:1.2rem}.component-library-card{gap:10px;padding:12px}.component-library-card__description,.component-library-card__usage p,.component-library-card__highlights ul{font-size:.92rem}.component-library-card__code{font-size:.8rem;padding:10px}}@media (max-width: 380px){.app-shell{--app-footer-height: 30px}.workspace-preview{padding:6px}.layout-frame{min-height:min(48vh,17rem)}.component-library__category-row>*{flex:1 1 100%}.component-library-card{padding:10px}.component-library-card__preview{min-height:96px;padding:10px}.component-library-card__code{border-radius:12px;font-size:.76rem}.app-shell__footer{font-size:.72rem;gap:6px;max-width:calc(100vw - 16px);padding:0 10px}:root{--app-topbar-height: 62px}.tile-card{max-width:none}}
