:root{color-scheme:dark;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;margin:0}html,body,#app{height:100%;overflow:hidden}#app{background:#1a1b1e;color:#e8e6e3}.view{height:100%}.hidden{display:none!important}.editor-view{display:grid;grid-template-rows:52px 1fr 44px}#toolbar{display:flex;align-items:center;gap:12px;padding:0 14px;background:#242529;border-bottom:1px solid #333}.story-title{flex:1;background:transparent;border:none;color:#e8e6e3;font-size:18px;font-weight:600;outline:none}.mode-toggle{padding:7px 16px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;background:#4a90d9;color:#fff}.mode-toggle.play{background:#e0a458;color:#1a1b1e}#workspace{display:grid;grid-template-columns:1fr 220px;min-height:0}#stage-wrap{position:relative;min-width:0}#stage{position:absolute;top:0;right:0;bottom:0;left:0;touch-action:none;cursor:crosshair}#palette{background:#242529;border-left:1px solid #333;overflow-y:auto;padding:10px;display:flex;flex-direction:column;gap:8px}.palette-title{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#999}.palette-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.palette-item{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 4px;background:#2f3036;border:2px solid transparent;border-radius:10px;cursor:pointer;color:#ccc}.palette-item:hover{background:#3a3b42}.palette-item.armed{border-color:#4a90d9;background:#34455c}.palette-emoji{font-size:28px}.palette-name{font-size:10px;text-align:center}.palette-hint{font-size:11px;color:#777;line-height:1.5;margin-top:auto}#pages{display:flex;align-items:center;gap:6px;padding:0 12px;background:#242529;border-top:1px solid #333;overflow-x:auto}.page-tab{padding:5px 14px;border:none;border-radius:6px;background:#2f3036;color:#bbb;font-size:13px;cursor:pointer;white-space:nowrap}.page-tab.active{background:#4a90d9;color:#fff}.page-tab.add{background:transparent;border:1px dashed #555}.palette-scroll{display:flex;flex-direction:column;gap:8px;overflow-y:auto}.palette-img{width:40px;height:40px;object-fit:contain}.artpad-open{padding:9px;border:none;border-radius:8px;background:#4a90d9;color:#fff;font-weight:600;cursor:pointer;margin-bottom:8px}.artpad-open.import{background:#3a3b42;border:1px dashed #666}.hidden-input{display:none}#selbar{position:absolute;display:flex;gap:2px;background:#242529;border:1px solid #444;border-radius:8px;padding:3px;z-index:10;box-shadow:0 4px 14px #0006}#selbar.hidden{display:none}#selbar button{border:none;background:transparent;color:#ddd;font-size:15px;padding:5px 8px;border-radius:6px;cursor:pointer}#selbar button:hover{background:#3a3b42}.artpad-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;display:flex;align-items:center;justify-content:center;z-index:100}.artpad-overlay.hidden{display:none}.artpad-card{background:#242529;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;max-width:92vw}.artpad-title{font-weight:700}.artpad-tools{display:flex;gap:6px}.artpad-btn{border:2px solid transparent;background:#2f3036;color:#ddd;border-radius:8px;padding:6px 11px;font-size:14px;cursor:pointer}.artpad-btn.active{border-color:#4a90d9;background:#34455c}.artpad-colors{display:flex;gap:6px;flex-wrap:wrap}.artpad-swatch{width:26px;height:26px;border-radius:50%;border:2px solid #555;cursor:pointer}.artpad-swatch.active{border-color:#fff;transform:scale(1.15)}.artpad-canvas{background:repeating-conic-gradient(#3a3b42,#3a3b42 25%,#2f3036 0%,#2f3036 50%) 0 0 / 20px 20px;border-radius:10px;touch-action:none;cursor:crosshair;max-width:100%}.artpad-actions{display:flex;gap:8px}.artpad-actions input{flex:1;background:#2f3036;border:1px solid #444;border-radius:8px;color:#eee;padding:7px 10px;outline:none}.artpad-actions button{border:none;border-radius:8px;padding:7px 13px;background:#2f3036;color:#ddd;cursor:pointer}.artpad-actions button.primary{background:#4a90d9;color:#fff;font-weight:600}.artpad-head{display:flex;justify-content:space-between;align-items:center}.artpad-head button{border:none;background:#2f3036;color:#ddd;border-radius:8px;padding:5px 10px;cursor:pointer;margin-left:6px}.artpad-card.fullscreen{width:96vw;height:96vh}.artpad-card.fullscreen .artpad-canvas{width:auto;height:100%;max-width:100%;aspect-ratio:1 / 1;margin:0 auto;flex:0 1 auto;min-height:0}.artpad-card{max-height:96vh}.artpad-canvas{width:320px;height:320px}.text-add{padding:7px 14px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;background:#3a3b42;color:#ddd}.textedit-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;display:flex;align-items:flex-start;justify-content:center;padding-top:12vh;z-index:110}.textedit-overlay.hidden{display:none}.textedit-card{background:#242529;border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;width:min(440px,92vw)}.textedit-card textarea{background:#2f3036;border:1px solid #444;border-radius:8px;color:#eee;padding:10px;font-size:16px;resize:vertical;outline:none;font-family:inherit}.textedit-row{display:flex;gap:6px;flex-wrap:wrap}body{user-select:none;-webkit-user-select:none}input,textarea{user-select:text;-webkit-user-select:text}#scalepop{position:absolute;display:flex;align-items:center;gap:8px;background:#242529;border:1px solid #444;border-radius:8px;padding:6px 10px;z-index:11;box-shadow:0 4px 14px #0006}#scalepop.hidden{display:none}#scalepop input[type=range]{width:140px;accent-color:#4a90d9}.scale-label{font-size:12px;color:#bbb;min-width:40px}.text-add.active{background:#4a90d9;color:#fff}.artpad-swatch.spectrum{position:relative;overflow:hidden;background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);cursor:pointer}.artpad-swatch.spectrum input[type=color]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.artpad-swatch.add-color{background:#2f3036;color:#ccc;font-size:15px;line-height:1}.artpad-colors.custom{min-height:26px;align-items:center}.custom-hint{font-size:11px;color:#666;font-style:italic}.tb-group{display:flex;align-items:center;gap:12px;flex:1;min-width:0}.bg-card{max-height:88vh;overflow-y:auto;width:min(460px,94vw)}.bg-spectrum{width:26px;height:26px;border:2px solid #555;border-radius:50%;padding:0;cursor:pointer;background:none}.bg-chip{width:58px;height:38px;border-radius:8px;border:2px solid #555;cursor:pointer}.bg-chip:hover{border-color:#4a90d9}.bg-grid{max-height:200px;overflow-y:auto}#selcount{font-size:11px;color:#7fb3e8;font-weight:700;padding:0 4px;align-self:center}#selcount.hidden{display:none}.palette-controls{display:flex;flex-direction:column;gap:8px;margin-bottom:8px}.palette-controls .artpad-open{margin-bottom:0}.palette-search{background:#2f3036;border:1px solid #444;border-radius:8px;color:#eee;padding:7px 10px;font-size:13px;outline:none}.palette-search:focus{border-color:#4a90d9}.cat-header{display:block;width:100%;text-align:left;background:none;border:none;color:#bbb;font-size:12px;font-weight:600;padding:6px;border-radius:6px;cursor:pointer}.cat-header:hover{background:#2f3036;color:#eee}.cat-chevron{font-size:9px;display:inline-block;width:12px}.cat-count{color:#666;font-weight:400;font-size:11px;margin-left:4px}.login-view{display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 30%,#2a3040,#1a1b1e 70%)}.login-card{display:flex;flex-direction:column;gap:12px;width:min(360px,90vw);text-align:center;background:#242529;border-radius:18px;padding:32px 28px;box-shadow:0 12px 48px #00000080}.login-logo{font-size:44px}.login-title{font-size:30px;font-weight:800;letter-spacing:.01em}.login-title.small{font-size:20px}.login-sub{color:#999;font-size:14px}.login-email{background:#2f3036;border:1px solid #444;border-radius:10px;color:#eee;padding:11px 14px;font-size:15px;outline:none;text-align:center}.login-email:focus{border-color:#4a90d9}.login-send{border:none;border-radius:10px;padding:12px;font-size:15px;font-weight:700;background:#4a90d9;color:#fff;cursor:pointer}.login-send:disabled{opacity:.5;cursor:default}.login-status{font-size:13px;color:#8fc1f0;min-height:18px}.login-skip{background:none;border:none;color:#777;font-size:13px;cursor:pointer;text-decoration:underline}.login-note{font-size:11px;color:#555;line-height:1.5}.dashboard-view{display:flex;flex-direction:column;overflow-y:auto}.dash-head{display:flex;justify-content:space-between;align-items:center;padding:18px 28px;border-bottom:1px solid #333}.dash-user{display:flex;align-items:center;gap:12px;font-size:13px;color:#999}.dash-signout{background:none;border:1px solid #555;border-radius:8px;color:#bbb;padding:6px 12px;font-size:12px;cursor:pointer}.dash-signout:hover{border-color:#e03131;color:#e03131}.dash-body{padding:24px 28px}.dash-loading,.dash-empty{color:#777;font-size:14px}.dash-empty{margin-top:16px}.dash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:16px}.dash-card{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:#242529;border:2px solid #333;border-radius:14px;padding:14px;min-height:150px;color:#ddd;font-size:14px;cursor:pointer;overflow:hidden}.dash-card:hover{border-color:#4a90d9}.dash-card.new{border-style:dashed;color:#8fc1f0;font-weight:600}.dash-card.import{border-style:dashed;color:#e0a458}.dash-plus{font-size:34px}.dash-card.story{padding:0;justify-content:flex-start}.dash-thumb{width:100%;height:110px;object-fit:cover;background:#2f3036}.dash-thumb.placeholder{display:flex;align-items:center;justify-content:center;font-size:38px}.dash-meta{padding:4px 10px 12px;text-align:center}.dash-name{font-weight:600;font-size:14px}.dash-date{font-size:11px;color:#777;margin-top:2px}.dash-delete{position:absolute;top:6px;right:6px;background:#0000008c;border:none;border-radius:6px;padding:4px 7px;font-size:12px;cursor:pointer;opacity:0;transition:opacity .15s}.dash-card:hover .dash-delete{opacity:1}
