@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@400;500;600;700&family=Outfit:wght@400;500;600;700&display=swap');
/* Admin console (desktop + mobile drawer) */
.admin-body{min-height:100vh;background:#f4f1f8;color:#251b30;display:flex;font-family:Outfit,"Noto Serif SC",sans-serif}.admin-sidebar{width:238px;flex:0 0 238px;background:#291f36;color:#eee6f7;padding:30px 18px;display:flex;flex-direction:column;min-height:100vh;position:sticky;top:0;height:100vh}.admin-sidebar>p{font-size:11px;color:#b4a8c3;letter-spacing:1px;margin:8px 0 35px}.admin-sidebar nav{display:grid;gap:7px}.admin-sidebar nav button{background:transparent;color:#cdbfdb;text-align:left;padding:13px;border-radius:11px;font-size:14px}.admin-sidebar nav button i{font-style:normal;margin-right:12px}.admin-sidebar nav button.active{background:#ffffff16;color:#fff}.sidebar-logout{margin-top:auto;background:#ffffff12;color:#eadff4;padding:12px;border-radius:10px}.admin-main{width:min(1180px,calc(100% - 238px));margin:0 auto;padding:34px 42px 80px}.admin-top{display:flex;align-items:center;gap:14px;margin-bottom:30px}.admin-top small{color:#8e7da1;font-size:11px;letter-spacing:1.4px}.admin-top h1{font:600 28px "Noto Serif SC";margin:4px 0 0}.admin-avatar{margin-left:auto;width:40px;height:40px;border-radius:50%;display:grid;place-items:center;background:#7658a5;color:#fff}.admin-top .icon-btn{display:none}.metric-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:15px;margin-bottom:22px}.metric,.admin-card,.config-box{background:#fff;border:1px solid #e9e2ef;border-radius:17px;padding:18px}.metric small,.metric span{display:block;color:#897c92;font-size:12px}.metric b{display:block;font-size:25px;margin:10px 0 4px;color:#563d78}.admin-card{padding:22px;margin:0 0 22px}.admin-card h2{margin:0 0 15px;font:600 19px "Noto Serif SC"}.split-grid,.config-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.admin-form{display:grid;gap:11px}.admin-form input,.admin-form textarea,.admin-form select{width:100%;border:1px solid #e9e2ef;background:#fcfaff;border-radius:10px;padding:11px 12px;outline:0}.admin-form textarea{min-height:82px;resize:vertical}.two-cols{display:grid;grid-template-columns:1fr 1fr;gap:10px}.content-list{display:grid;gap:9px}.content-list button,.content-list>div{border:1px solid #e9e2ef;background:#fff;border-radius:11px;padding:11px;display:flex;text-align:left;align-items:center;gap:10px;color:#251b30}.content-list i{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;color:#fff;font-style:normal}.content-list span{display:grid;gap:3px;flex:1}.content-list small,.content-list em{color:#897c92;font-size:11px;font-style:normal}.config-box summary{cursor:pointer;font-weight:600}.config-box summary small{float:right;color:#8465aa;font-weight:400}.config-box form{margin-top:15px}.user-table{display:grid;gap:9px}.user-table article{border:1px solid #e9e2ef;border-radius:12px;padding:12px;display:flex;justify-content:space-between;gap:12px;align-items:center}.user-table b,.user-table small{display:block}.user-table small{margin-top:3px;color:#897c92;font-size:11px}.user-table form{display:flex;gap:7px}.user-table select,.user-table input{border:1px solid #e9e2ef;border-radius:8px;padding:8px;background:#fff}.user-table input{width:70px}.user-table button{background:#6946b5;color:#fff;border-radius:8px;padding:8px 10px}.checklist p{margin:0;padding:12px 0;border-bottom:1px solid #e9e2ef;color:#65586d;font-size:14px}.admin-mask{display:none}.error{color:#b14f65}
@media(max-width:820px){.admin-sidebar{position:fixed;z-index:20;left:0;transform:translateX(-100%);transition:transform .2s;width:260px;box-shadow:12px 0 30px #170e2633}.admin-sidebar.open{transform:translateX(0)}.admin-mask.show{display:block;position:fixed;z-index:19;inset:0;background:#170e2655}.admin-main{width:100%;padding:22px 16px 42px}.admin-top .icon-btn{display:grid;place-items:center;flex:0 0 auto}.metric-grid{grid-template-columns:repeat(2,1fr);gap:10px}.metric:last-child{grid-column:span 2}.split-grid,.config-grid{grid-template-columns:1fr}.admin-card{padding:17px}.user-table article{align-items:stretch;flex-direction:column}.user-table form{display:grid;grid-template-columns:1fr 74px 56px}.user-table select,.user-table input{width:100%}}

:root { --ink:#251b30; --muted:#7f7488; --paper:#fbf8ff; --violet:#6946b5; --line:#e9e2ef; }
* { box-sizing:border-box; } body { margin:0; background:#ede8f3; color:var(--ink); font-family:Outfit,"Noto Serif SC",system-ui,sans-serif; } button,input { font:inherit; } button { border:0; cursor:pointer; } .landing { min-height:100vh; overflow:hidden; position:relative; color:#fff; background:radial-gradient(circle at 74% 20%,#8665bd 0,#44315d 35%,#21182d 80%); padding:24px clamp(24px,7vw,120px); } .landing header,.page-header,.app-header { display:flex; justify-content:space-between; align-items:center; position:relative; z-index:1; } .brand { color:#fff; text-decoration:none; letter-spacing:-1px; font-size:22px; font-weight:700; }.brand span { font-weight:400; opacity:.65; }.brand.dark { color:var(--ink); }.text-button { color:#fff; background:transparent; opacity:.85; }.landing-copy { max-width:600px; position:relative; z-index:1; margin:15vh 0 80px; }.eyebrow { margin:0 0 16px; font-size:11px; letter-spacing:2px; color:#e7d9ff; font-weight:600; }.eyebrow.ink { color:#8267a7; }.landing h1 { font:600 clamp(42px,7vw,72px)/1.16 "Noto Serif SC",serif; letter-spacing:-3px; margin:0 0 22px; }.landing h1 em { color:#e4c6ff; font-style:normal; }.landing-copy>p { font-size:16px; line-height:1.8; opacity:.82; }.download-actions { display:flex; gap:12px; margin:32px 0 15px; }.primary,.secondary { border-radius:14px; padding:14px 18px; font-weight:600; }.primary { color:#fff; background:linear-gradient(135deg,#7d5ac6,#b579a7); box-shadow:0 9px 24px #56399355; }.primary span { margin-left:16px; }.secondary { color:#fff; background:#ffffff1a; border:1px solid #ffffff3d; }.landing small { opacity:.55; }.phone-mock { position:absolute; z-index:1; right:11%; bottom:-75px; width:270px; height:520px; border:8px solid #352943; border-radius:35px; background:linear-gradient(160deg,#eadffc,#ac86ca); padding:28px 20px; box-shadow:0 24px 70px #120b2166; text-align:center; transform:rotate(7deg); }.mock-top { display:flex; justify-content:space-between; font-size:10px; }.mock-avatar,.character-avatar { width:82px; height:82px; border-radius:50%; display:grid; place-items:center; margin:55px auto 14px; background:#574172; color:#f9eaff; font-size:34px; box-shadow:inset 0 0 25px #fff6; }.phone-mock p { color:#5b426e; font-family:"Noto Serif SC"; }.mock-bubble { margin-top:38px; padding:12px; border-radius:16px 16px 16px 4px; background:#ffffffb5; text-align:left; font-size:13px; color:#543c66; }.orb-one,.orb-two { position:absolute; border-radius:50%; filter:blur(4px); opacity:.45; }.orb-one { width:460px;height:460px;right:-150px;top:-180px;background:#d798d2; }.orb-two { width:260px;height:260px;left:-100px;bottom:-100px;background:#9f79db; }.shell { width:100%; max-width:460px; min-height:100vh; margin:auto; background:var(--paper); position:relative; padding:calc(env(safe-area-inset-top) + 18px) 18px 88px; }.app-header { gap:12px; }.app-header>div { flex:1; }.app-header b,.app-header small { display:block; }.app-header small { color:var(--muted); font-size:11px; margin-top:3px; }.icon-btn { width:38px;height:38px;border-radius:50%;background:#f1ebf6;color:#6b5b77;font-size:20px; }.story-card { display:flex; align-items:center; gap:13px; margin:22px 0 20px; padding:16px; color:#fff; border-radius:20px; background:linear-gradient(130deg,var(--card),#342b45); }.story-card>span { font-size:30px; }.story-card div { flex:1; }.story-card small,.story-card b,.story-card p { display:block; }.story-card small { opacity:.7;font-size:10px; }.story-card b { margin:4px 0;font-family:"Noto Serif SC"; }.story-card p { margin:0;font-size:11px;opacity:.8; }.story-card button { border-radius:10px;padding:8px 10px;color:#493560;font-size:11px; }.date-label { text-align:center;color:#a499ad;font-size:11px;margin:18px; }.messages { display:flex; flex-direction:column;gap:12px; min-height:50vh; }.message { max-width:78%; padding:12px 14px; border-radius:16px; font-size:14px;line-height:1.55; }.message.ai { align-self:flex-start;background:#eee7f5;border-bottom-left-radius:4px; }.message.user { align-self:flex-end;background:#7c5cbc;color:#fff;border-bottom-right-radius:4px; }.composer { position:absolute;bottom:72px;left:18px;right:18px;display:flex;gap:8px; }.composer input { min-width:0; flex:1;border:1px solid var(--line);border-radius:22px;padding:13px 15px;background:#fff;outline:none; }.composer button { width:44px;border-radius:50%;background:var(--violet);color:#fff;font-size:20px; }.bottom-nav { height:65px; position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-around;background:#fffffff2;border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom); }.bottom-nav button { width:33%;background:transparent;color:#9c91a3;font-size:11px; }.bottom-nav span { display:block;font-size:18px;margin-bottom:3px; }.bottom-nav .active { color:var(--violet);font-weight:600; }.page h2 { font:600 28px/1.35 "Noto Serif SC";letter-spacing:-1px;margin:0 0 9px; }.sub { margin:0;color:var(--muted);font-size:14px; }.pill { background:#ede5fb;color:#6946b5;border-radius:16px;padding:8px 12px;font-size:12px; }.page>.eyebrow { margin-top:42px; }.character-list { display:grid;gap:13px;margin-top:28px; }.character { text-align:left;display:flex;align-items:center;gap:14px;padding:14px;background:#fff;border:1px solid var(--line);border-radius:18px;color:var(--ink); }.character.chosen { border:1px solid var(--card);box-shadow:0 7px 20px #6c588416; }.character-avatar { flex:0 0 auto;width:63px;height:63px;margin:0;background:linear-gradient(140deg,var(--card),#efe3ff);font-size:27px; }.character div:nth-child(2) { flex:1; }.character b,.character small { display:block; }.character small { color:#927da7;font-size:11px;margin-top:3px; }.character p { margin:6px 0 0;font-size:12px;color:#786c81; }.character>span { color:#8e7ba0; }.profile-hero { text-align:center;padding:50px 0 28px; }.user-avatar { margin:auto auto 13px;width:70px;height:70px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(140deg,#d5c4ef,#8d70bb);color:#fff;font-family:"Noto Serif SC";font-size:24px; }.profile-hero h2 { font-size:23px; }.profile-hero p { margin:7px;color:var(--muted);font-size:13px; }.membership { padding:22px;border-radius:21px;color:#fff;background:linear-gradient(135deg,#30243c,#765387); }.membership small { color:#e2c6ff;letter-spacing:1px; }.membership h3 { margin:8px 0 6px;font:600 21px "Noto Serif SC"; }.membership p { margin:0 0 15px;font-size:12px;line-height:1.6;opacity:.76; }.membership .primary { width:100%;background:#fff;color:#503768;box-shadow:none; }.setting-list { margin-top:20px; }.setting-list button { width:100%;text-align:left;padding:17px 3px;background:transparent;border-bottom:1px solid var(--line);color:var(--ink); }.setting-list span { float:right;color:#8f8397; }.modal-backdrop { position:fixed;inset:0;z-index:5;background:#20172c99;display:grid;place-items:end center;padding:20px; }.modal { position:relative;max-width:460px;width:100%;background:#fff;border-radius:26px;padding:30px 24px;box-shadow:0 -8px 45px #160d2133; }.modal h2 { margin:0 0 12px;font:600 25px "Noto Serif SC"; }.modal p:not(.eyebrow) { color:#71677c;line-height:1.7;font-size:14px; }.modal .primary { width:100%;margin-top:12px; }.close { position:absolute;right:15px;top:13px;background:transparent;color:#8b7e91;font-size:25px; }.modal .primary.close { position:static;font-size:14px; }
@media (min-width:700px) { .shell { box-shadow:0 0 50px #4a385d22; }.landing-copy { margin-left:10%; }.phone-mock { right:18%; } }
@media (max-width:520px) { .landing { padding:22px 22px; }.landing-copy { margin:11vh 0 0; }.landing h1 { font-size:42px; }.phone-mock { display:none; } }
.auth-card { margin-top:48px; padding:24px; border:1px solid var(--line); border-radius:22px; background:#fff; }.auth-card h2 { font-size:25px; }.auth-card form { display:grid; gap:14px; margin-top:24px; }.auth-card label { color:#65586d; font-size:12px; font-weight:600; }.auth-card input { display:block; width:100%; margin-top:7px; padding:13px; border:1px solid var(--line); border-radius:12px; outline:none; }.auth-card .primary { margin-top:4px; }.auth-switch { display:flex; justify-content:space-between; gap:12px; margin:18px 0 0; }.auth-switch button { padding:0; background:transparent; color:#71519f; font-size:12px; }.auth-card [role=status] { min-height:20px; color:#b14f65; font-size:13px; }.admin-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:24px 0 36px; }.admin-stats div { padding:17px 10px; border-radius:15px; background:#eee6f7; text-align:center; }.admin-stats b,.admin-stats small { display:block; }.admin-stats b { font-size:18px; color:#5a3d80; }.admin-stats small { margin-top:7px; color:#766887; font-size:11px; }.integration-grid { display:grid; gap:10px; margin:16px 0 36px; }.integration-grid details { border:1px solid var(--line); border-radius:14px; background:#fff; padding:14px; }.integration-grid summary { cursor:pointer; font-weight:600; }.integration-grid summary small { float:right; color:#8262a8; font-weight:400; }.integration-grid form { display:grid; gap:9px; margin-top:15px; }.integration-grid label { font-size:11px; color:#766b7d; }.integration-grid input,.integration-grid select { width:100%; margin-top:5px; border:1px solid var(--line); padding:9px; border-radius:9px; background:#fff; }.integration-grid .primary { padding:10px; font-size:13px; }
