/* Form Studio · Dulan System Design System 1.0 · Stockroom v1.3.4.1 strict alignment */
:root{
  --bg:var(--dulan-bg);--panel:var(--dulan-surface);--text:var(--dulan-ink);--muted:var(--dulan-muted);--line:var(--dulan-border);
  --primary:var(--app-primary);--primary-2:#2c6fae;--soft:var(--app-primary-soft);--danger:var(--dulan-danger);--radius:var(--dulan-radius-card);
}
html[data-dulan-app="formstudio"]{background:var(--dulan-bg)}
body{font-family:var(--dulan-font);background:var(--dulan-bg);color:var(--dulan-ink)}
body.dulan-shell-mounted{padding:0!important;overflow:hidden}

/* App shell — preserve existing IDs/classes, enforce DS1.0 geometry */
.app.dulan-shell{min-height:0!important;height:100dvh!important;grid-template-columns:var(--dulan-sidebar-width) minmax(0,1fr)!important;overflow:hidden!important;padding-top:env(safe-area-inset-top)!important;padding-left:env(safe-area-inset-left)!important;padding-right:env(safe-area-inset-right)!important;background:var(--app-sidebar-deep)!important}
.sidebar.dulan-sidebar{width:auto!important;height:100%!important;min-height:0!important;position:relative!important;top:auto!important;padding:22px 16px max(16px,env(safe-area-inset-bottom))!important;background:linear-gradient(160deg,var(--app-sidebar-top) 0%,var(--app-sidebar-mid) 46%,var(--app-sidebar-deep) 100%)!important;color:#fff!important;border-radius:0!important;box-shadow:none!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.sidebar .dulan-sidebar-scroll{flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain}
.sidebar .brand.dulan-brand{margin:0 0 24px!important;padding:0 10px 30px!important;display:block!important;align-items:flex-start!important}
.sidebar .dulan-brand-link{display:flex!important;align-items:center!important;width:100%!important;padding:0!important;border:0!important;background:transparent!important;justify-content:flex-start!important;gap:13px!important;min-height:0!important;color:#fff!important;text-align:left!important}
.sidebar .dulan-brand-mark{width:54px!important;height:54px!important;object-fit:contain!important;flex:0 0 54px!important}
.sidebar .dulan-brand-copy{display:flex!important;flex-direction:column!important;align-items:flex-start!important;justify-content:center!important;gap:4px!important;min-width:0!important}
.sidebar .dulan-brand-title{font-size:23px!important;font-weight:800!important;line-height:1.05!important;color:#fff!important;letter-spacing:-.02em!important;white-space:nowrap!important}
.sidebar .dulan-brand-copy>.dulan-brand-subtitle{margin:0!important;color:#d9edf9!important;font-size:11.5px!important;font-weight:600!important;line-height:1.22!important;white-space:normal!important;text-align:left!important}
.sidebar-tree{display:block!important;overflow:visible!important;margin:0!important}
.sidebar-tree .tree-row{min-height:43px!important;padding:11px 13px!important;border-radius:10px!important;color:#e5f1fa!important;font-weight:650!important;gap:8px!important}
.sidebar-tree .tree-row:hover,.sidebar-tree .tree-row.active{background:#ffffff24!important;color:#fff!important}
.sidebar-tree .tree-caret{color:#c7e0f2!important}
.sidebar-tree .tree-children{border-left:1px solid #ffffff32!important;margin-left:17px!important;padding-left:8px!important;gap:2px!important}
.sidebar-tree .tree-folder,.sidebar-tree .tree-form{min-height:36px!important;padding-top:8px!important;padding-bottom:8px!important;font-size:12.5px!important;color:#d9eaf7!important}
.sidebar-tree .tree-empty{color:#b9d4e8!important}
.account-box.dulan-sidebar-bottom{margin-top:auto!important;padding:18px 8px 0!important;border-top:1px solid #ffffff38!important;flex:0 0 auto}
.account-email{color:#fff!important;font-size:12px!important;font-weight:700}
.sync-status{color:#d5e8f5!important}.sync-status.pending,.sync-status.syncing{color:#f6e7c6!important}.sync-status.error{color:#ffd5d1!important}
.sidebar-utility-stack{gap:8px!important}.sidebar-utility-stack .storage-usage,.sidebar-utility-stack .ai-usage-box{border-color:#ffffff26!important;background:#ffffff0f!important;color:#edf7fd!important;border-radius:10px!important}
.sidebar .dulan-switch-button,.sidebar #logoutBtn{width:100%!important;min-height:43px!important;border:1px solid #ffffff55!important;border-radius:10px!important;color:#fff!important;font-weight:700!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important}
.sidebar .dulan-switch-button{margin:8px 0!important;background:#ffffff12!important}.sidebar #logoutBtn{margin:0!important;background:transparent!important}
.sidebar .dulan-switch-button:hover,.sidebar #logoutBtn:hover{background:#ffffff20!important}

.main.dulan-workspace{min-width:0!important;padding:0!important;padding-bottom:0!important;overflow:auto!important;background:var(--dulan-bg)!important}
.formstudio-content.dulan-content{max-width:1500px;padding:32px 36px max(150px,env(safe-area-inset-bottom));margin:auto}

/* Shared components */
.btn{min-height:43px;border:1px solid var(--dulan-border);border-radius:10px;padding:10px 15px;background:#fff;color:var(--dulan-ink);font-weight:700;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.btn:hover{background:#eef3f4}.btn.primary,.form-primary-action{background:var(--app-primary)!important;border-color:var(--app-primary)!important;color:#fff!important}.btn.primary:hover,.form-primary-action:hover{background:#2c6fae!important}.btn.danger,.danger{color:var(--dulan-danger)}
.card,.question-card,.question-group-card,.analytics-card,.admin-form-row{background:#fff;border-color:var(--dulan-border)!important;border-radius:15px!important;box-shadow:0 2px 4px #13263303}
.card{padding:22px}
input[type=text],input[type=number],input[type=date],input[type=time],input[type=email],input[type=password],input[type=search],textarea,select,.dulan-input,.dulan-select,.dulan-textarea{border:1px solid #d5dfe3!important;border-radius:9px!important;background:#fff;color:var(--dulan-ink);padding:11px 12px;min-height:44px;max-width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid color-mix(in srgb,var(--app-primary) 55%,white)!important;outline-offset:1px}
input[type=checkbox],input[type=radio]{accent-color:var(--app-primary)}
.table-wrap{overflow:auto;border:1px solid var(--dulan-border)!important;border-radius:13px!important;background:#fff}table{border-collapse:collapse;width:100%;font-size:.875rem}th{background:#f8fafb!important;color:var(--dulan-muted)!important;font-weight:600!important;padding:14px 18px!important;border-bottom:1px solid var(--dulan-border)!important}td{padding:15px 18px!important;border-bottom:1px solid #edf1f3!important}
.pill,.role-badge,.shared-badge,.user-stat{border-radius:5px!important;background:var(--app-primary-soft)!important;color:var(--app-primary)!important;font-weight:700!important}
.notice{border:1px solid #d8e7f2!important;background:#eef7fd!important;color:#345e7c!important;border-radius:10px!important}
.folder-chip.active{background:var(--app-primary)!important;border-color:var(--app-primary)!important;color:#fff!important}
.editor-tab.active{color:var(--dulan-ink)!important}.editor-tab{border-radius:10px!important}.editor-tabs{border-radius:10px!important;background:#e9eef1!important}
.switch input:checked + .switch-slider{background:var(--app-primary)!important}

/* Header / page heads */
.topbar{align-items:flex-start!important;gap:18px!important;margin-bottom:24px!important}.topbar h1{font-size:1.9rem!important;letter-spacing:-.04em!important;color:var(--dulan-ink)}.topbar .muted{font-size:.9rem;color:var(--dulan-muted)}
.editor-filebar{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}

/* Modal / toast */
.ai-modal,.share-modal,.redeem-key-modal,.question-type-modal{background:#102a3e77!important;backdrop-filter:blur(3px)!important}
.ai-panel,.share-panel,.redeem-key-panel,.question-type-panel{border:0!important;border-radius:18px!important;box-shadow:0 24px 100px #0d1f3455!important;color:var(--dulan-ink)!important}
.toast{background:#173448!important;color:#fff!important;border-radius:10px!important;box-shadow:0 12px 34px #0d1f3438!important;padding:11px 15px!important}
.more-menu{border-color:var(--dulan-border)!important;border-radius:10px!important;box-shadow:0 14px 35px #0d1f3426!important}.more-menu button{border-radius:8px!important}

/* Login / access gate — computed geometry copied from Stockroom v1.3.4.1. Auth logic is untouched. */
body.dulan-auth-mounted{padding:0!important;overflow:auto!important;background:#f5f6f8!important}
.dulan-login{min-height:100dvh;display:grid;place-items:center;padding:max(25px,env(safe-area-inset-top)) max(25px,env(safe-area-inset-right)) max(25px,env(safe-area-inset-bottom)) max(25px,env(safe-area-inset-left));background:#f5f6f8!important}
.dulan-login-card{width:min(440px,100%)!important;max-width:440px!important;padding:28px!important;background:#fff!important;border:1px solid #e5e7eb!important;border-radius:16px!important;box-shadow:0 1px 2px rgba(0,0,0,.03)!important}
.dulan-login-card>img{width:62px!important;height:62px!important;object-fit:contain!important;display:block!important;margin:0 0 24px!important}
.dulan-login-card .eyebrow{margin:0 0 12px!important;font-size:12px!important;line-height:normal!important;letter-spacing:0!important;text-transform:uppercase!important;color:#6b7280!important;font-weight:700!important}
.dulan-login-card h1{margin:0 0 8px!important;font-size:28px!important;line-height:normal!important;letter-spacing:0!important;color:#1f2328!important;font-weight:700!important}
.dulan-login-card h2{font-size:1.2rem!important;margin:0 0 14px!important;color:#1f2328!important}
.dulan-login-card p{font-size:.9rem!important;line-height:1.65!important;color:#6b7280!important}
.dulan-login-card .dulan-login-google,.dulan-login-card .dulan-login-action{width:100%!important;min-height:43px!important;margin-top:12px!important;padding:10px 15px!important;border-radius:10px!important;font-weight:600!important}
.dulan-login-card .dulan-login-note{margin-top:20px!important}
.dulan-login-divider{margin:25px 0 12px!important;border-top:1px solid #e5e7eb!important;padding-top:18px!important}
.dulan-login-email{margin:16px 0 4px;padding:10px 12px;border-radius:9px;background:#f8fafb;color:#475467;font-size:13px;overflow-wrap:anywhere}
.dulan-login-meta{margin-top:6px!important;color:#6b7280!important}
.dulan-login-code{display:block;margin-top:10px;padding:10px 12px;border-radius:10px;background:#f3f4f6;font-size:12px;overflow:auto}
.dulan-login-version{display:block;margin-top:18px}
.auth-error{margin-top:14px!important}

/* Bottom add toolbar tracks official sidebar widths */
.bottom-addbar{left:calc(var(--dulan-sidebar-width) + 24px)!important;border-radius:15px!important;border-color:var(--dulan-border)!important}

/* Desktop card spacing stays from V0.23.14 refinements, with DS card geometry */
@media(min-width:861px){
  .cards{grid-template-columns:repeat(auto-fill,minmax(340px,1fr))!important;gap:18px!important}.cards .card{padding:22px!important}
}

/* Mobile shell */
@media(max-width:860px){
  body.dulan-shell-mounted{height:100dvh!important;max-height:100dvh!important}
  .app.dulan-shell{display:block!important;height:100dvh!important;padding-top:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top))!important}
  .mobile-appbar.dulan-mobile-appbar{display:flex!important;position:fixed!important;inset:0 0 auto!important;z-index:30!important;height:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top))!important;padding:env(safe-area-inset-top) max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left))!important;align-items:center!important;justify-content:space-between!important;background:linear-gradient(110deg,var(--app-sidebar-top) 0%,var(--app-sidebar-mid) 100%)!important;color:#fff!important;border-bottom:1px solid #ffffff26!important}
  .mobile-appbar-home.dulan-mobile-brand{display:flex!important;align-items:center!important;gap:9px!important;min-width:0;color:#fff!important;text-decoration:none;padding:6px 3px!important}
  .dulan-mobile-brand-mark{width:30px!important;height:30px!important;object-fit:contain;flex:0 0 30px}.dulan-mobile-brand-copy{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:2px;min-width:0}.dulan-mobile-brand-title{font-size:18px;font-weight:800;line-height:1.05;color:#fff}.dulan-mobile-brand-subtitle{font-size:11px;font-weight:600;color:#d9edf9;line-height:1.15;white-space:nowrap}
  .dulan-mobile-actions{display:flex!important;align-items:center!important;gap:2px!important;flex:0 0 auto}.mobile-menu-btn.dulan-icon-button,.dulan-mobile-actions .dulan-icon-button{width:40px!important;height:40px!important;min-height:40px!important;padding:8px!important;border:0!important;background:transparent!important;color:#fff!important;border-radius:10px!important;box-shadow:none!important;display:grid!important;place-items:center!important}.mobile-menu-btn:hover,.dulan-mobile-actions .dulan-icon-button:hover{background:#ffffff16!important}
  .sidebar-backdrop.dulan-menu-backdrop:not([hidden]){display:block!important;position:fixed!important;inset:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top)) 0 0!important;z-index:20!important;width:100%!important;border:0!important;border-radius:0!important;background:#02061775!important;padding:0!important;opacity:1!important;pointer-events:auto!important}
  .sidebar.dulan-sidebar{position:fixed!important;z-index:25!important;top:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top))!important;right:0!important;left:auto!important;width:var(--dulan-mobile-sidebar-width)!important;height:calc(100dvh - var(--dulan-mobile-bar-height) - env(safe-area-inset-top))!important;max-height:none!important;padding:18px 14px max(18px,env(safe-area-inset-bottom))!important;transform:translateX(105%)!important;visibility:hidden!important;transition:transform .22s ease,visibility .22s!important;box-shadow:-20px 0 50px #00000030!important;border-radius:0!important}
  .sidebar.dulan-sidebar.open{transform:translateX(0)!important;visibility:visible!important}.sidebar .brand.dulan-brand{display:none!important}
  .sidebar .dulan-sidebar-scroll{overflow:auto!important}.sidebar-tree .tree-children{margin-left:9px!important}
  .main.dulan-workspace{height:calc(100dvh - var(--dulan-mobile-bar-height) - env(safe-area-inset-top))!important;max-height:none!important;overflow:auto!important}.formstudio-content.dulan-content{padding:22px 16px max(170px,env(safe-area-inset-bottom))!important}
  .bottom-addbar{left:12px!important;right:12px!important;bottom:max(12px,env(safe-area-inset-bottom))!important}
  .topbar{align-items:flex-start!important;gap:10px!important}.topbar h1{font-size:1.55rem!important}.topbar .muted{font-size:.82rem!important}
  .card{padding:18px!important}
  .dulan-login-card{padding:28px!important}
  .toast{bottom:calc(22px + env(safe-area-inset-bottom))!important}
}
@media(max-width:390px){.mobile-menu-btn.dulan-icon-button,.dulan-mobile-actions .dulan-icon-button{width:38px!important;height:38px!important;min-height:38px!important;padding:7px!important}}

/* iPad: retain V0.23.17 independent-scroll behavior with Dulan shell */
body.ipad-shell-active.dulan-shell-mounted{height:100dvh!important;max-height:100dvh!important;overflow:hidden!important;overscroll-behavior:none!important}
body.ipad-shell-active .main.dulan-workspace{overflow-y:hidden!important;overflow-x:hidden!important;overscroll-behavior-y:none!important}
body.ipad-shell-active .main.dulan-workspace.is-scrollable{overflow-y:auto!important;overscroll-behavior-y:contain!important}
body.ipad-shell-active .sidebar.dulan-sidebar{overflow:hidden!important}
body.ipad-shell-active .sidebar .sidebar-tree{overflow-y:hidden!important}body.ipad-shell-active .sidebar .sidebar-tree.is-scrollable{overflow-y:auto!important}
@media(max-width:860px){
  body.ipad-shell-active .app.dulan-shell{padding-top:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top))!important;padding-left:env(safe-area-inset-left)!important;padding-right:env(safe-area-inset-right)!important}
  body.ipad-shell-active .sidebar.dulan-sidebar{top:calc(var(--dulan-mobile-bar-height) + env(safe-area-inset-top))!important;height:calc(100dvh - var(--dulan-mobile-bar-height) - env(safe-area-inset-top))!important;max-height:calc(100dvh - var(--dulan-mobile-bar-height) - env(safe-area-inset-top))!important}
  body.ipad-shell-active .main.dulan-workspace{height:100%!important}
}

/* DS 1.0 wins over the legacy V0.23.17 iPad 240px shell override. */
@media(min-width:861px){
  body.ipad-shell-active .app.dulan-shell{grid-template-columns:var(--dulan-sidebar-width) minmax(0,1fr)!important}
}