:root{
  --navy:#0d3154;--navy-2:#092844;--blue:#087af2;--blue-2:#0b63df;--ink:#102e53;--muted:#66809e;
  --line:#dce8f4;--soft:#f4f9fe;--white:#fff;--green:#18a957;--red:#ef3f3f;
  --shadow:0 10px 28px rgba(24,65,105,.08);--radius:8px;
}
*{box-sizing:border-box}html{min-height:100%;background:#f4f8fc}body{margin:0;min-height:100vh;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;-webkit-font-smoothing:antialiased}button,input,textarea{font:inherit}button{cursor:pointer}a{text-decoration:none;color:inherit}
/* shared */
.button{height:40px;border:0;border-radius:6px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;gap:8px;background:linear-gradient(180deg,#1386f7,#0875e9);color:#fff;font-size:13px;font-weight:700;box-shadow:0 5px 12px rgba(8,117,233,.18);transition:.18s ease}.button:hover{transform:translateY(-1px);filter:brightness(1.02)}.button:disabled{opacity:.65;cursor:wait;transform:none}.button.secondary{background:#f5fbff;color:#0871df;border:1px solid #bfe0ff;box-shadow:none}.button.danger{background:#f43c3c;box-shadow:0 5px 12px rgba(244,60,60,.14)}.icon{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center}.muted{color:var(--muted)}.small{font-size:11px}.nowrap{white-space:nowrap}
/* login */
.login-page{background:#f6faff;display:grid;place-items:center;padding:24px}.login-shell{width:min(100%,820px);min-height:500px;background:#fff;border-radius:6px;box-shadow:0 16px 40px rgba(15,55,95,.08);display:grid;grid-template-columns:45% 55%;overflow:hidden;border:1px solid #e2edf7}.login-brand{position:relative;overflow:hidden;background:linear-gradient(180deg,#103b62,#082b4a);color:#fff;padding:70px 34px 40px;display:flex;flex-direction:column;align-items:center;text-align:center}.login-brand:after{content:"";position:absolute;left:-15%;right:-15%;bottom:-60px;height:180px;background:radial-gradient(ellipse at 50% 20%,rgba(29,101,157,.48),transparent 68%);border-radius:50%}.brand-logo{width:64px;height:64px;z-index:1}.login-brand h1{z-index:1;font-size:27px;margin:12px 0 8px;letter-spacing:-.5px}.login-brand p{z-index:1;margin:0;font-size:12px;color:#dcecff}.brand-foot{z-index:1;margin-top:auto;font-size:11px;font-weight:600;display:flex;gap:8px;align-items:center}.lock-dot{font-size:18px}.login-form{padding:82px 44px 44px;display:flex;flex-direction:column}.login-form h2{font-size:20px;margin:0 0 6px}.login-form .sub{font-size:11px;color:var(--muted);margin:0 0 22px}.field{margin:0 0 12px}.field label{display:block;font-size:11px;font-weight:700;margin:0 0 6px;color:#385879}.input{height:38px;width:100%;border:1px solid #d9e5f0;border-radius:6px;background:#fff;padding:0 11px;color:var(--ink);outline:none}.input:focus{border-color:#79b6f5;box-shadow:0 0 0 3px rgba(8,122,242,.08)}.password-wrap{position:relative}.password-wrap .input{padding-right:42px}.eye{position:absolute;right:5px;top:4px;width:30px;height:30px;border:0;background:transparent;color:#6b85a2}.login-error{display:none;color:#b42318;background:#fff1f0;border:1px solid #f2c8c3;border-radius:6px;padding:9px 10px;font-size:11px;margin:3px 0 12px}.login-error.show{display:block}.login-form .button{width:100%;margin-top:8px}
/* owner shell */
.owner-page{background:#f6faff}.owner-shell{min-height:100vh;display:grid;grid-template-columns:160px 1fr}.sidebar{background:linear-gradient(180deg,#0c3457,#092a49);color:#fff;position:relative;overflow:hidden}.sidebar:after{content:"";position:absolute;left:-60px;right:-50px;bottom:-45px;height:180px;background:radial-gradient(ellipse at 50% 20%,rgba(20,79,124,.6),transparent 70%);border-radius:50%}.sidebar-brand{height:56px;display:flex;align-items:center;gap:8px;padding:0 16px;font-size:13px;font-weight:800;position:relative;z-index:1}.sidebar-brand img{width:25px;height:25px}.nav{padding:12px 8px;position:relative;z-index:1}.nav a{height:36px;border-radius:6px;padding:0 11px;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:600;margin-bottom:4px;color:#f4f9ff}.nav a:hover{background:rgba(255,255,255,.08)}.nav a.active{background:linear-gradient(180deg,#087cf0,#0868d9);box-shadow:0 5px 12px rgba(0,0,0,.14)}.nav-icon{width:16px;text-align:center}.owner-main{min-width:0}.owner-header{height:56px;background:#fff;border-bottom:1px solid #dce7f2;display:flex;align-items:center;justify-content:space-between;padding:0 22px;gap:15px}.owner-title{font-size:15px;font-weight:800}.owner-main-body{padding:24px;max-width:1100px;margin:0 auto}.section-head{margin-bottom:18px}.section-head h1{font-size:16px;margin:0 0 5px}.section-head p{font-size:10px;color:var(--muted);margin:0}.owner-card{background:#fff;border:1px solid #dce8f3;border-radius:7px;box-shadow:var(--shadow)}
/* create */
.create-card{padding:24px}.create-card h2{font-size:16px;margin:0 0 4px}.create-card .sub{font-size:10px;color:var(--muted);margin:0 0 20px}.create-card>.button{width:100%}.success{margin-top:18px;border:1px solid #c8ecd9;background:#f0fcf6;border-radius:6px;padding:16px;display:none}.success.show{display:block}.success-title{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:800;color:#0a8f4c;margin-bottom:13px}.success-icon{width:16px;height:16px;border-radius:50%;background:#18b45d;color:#fff;display:grid;place-items:center;font-size:10px}.url-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.url-box{background:#fff;border:1px solid #d9e6f1;border-radius:6px;padding:11px}.url-box label{font-size:9px;font-weight:800;display:block;margin-bottom:6px}.url-row{display:flex;gap:7px}.url-row .input{height:32px;font-size:10px;min-width:0}.copy{height:32px;padding:0 10px;font-size:10px}.share-note{font-size:9px;line-height:1.5;color:#69839f}.create-actions{display:flex;justify-content:flex-end;margin-top:12px}.create-actions .button{height:34px;font-size:10px}
/* dashboard */
.dash-top{height:50px;background:#fff;border-bottom:1px solid #dce8f2;display:flex;align-items:center;gap:10px;padding:0 18px}.session-pill{font-size:10px;font-weight:700;padding:7px 10px;border:1px solid #dce8f3;border-radius:5px;background:#fbfdff}.live-pill{font-size:9px;font-weight:800;color:#119a50;background:#edfbf3;border-radius:12px;padding:6px 10px}.live-pill:before{content:"";display:inline-block;width:6px;height:6px;background:#18b45d;border-radius:50%;margin-right:5px}.dash-update{margin-left:auto;font-size:9px;color:#5e7793}.dash-body{padding:14px 18px}.dash-grid{display:grid;grid-template-columns:230px minmax(320px,1fr) 200px;gap:10px}.dash-card{background:#fff;border:1px solid #dce8f3;border-radius:6px;box-shadow:0 6px 16px rgba(30,75,115,.05);padding:13px}.dash-card h3{font-size:11px;margin:0 0 12px}.info-list{display:grid;gap:10px}.info-row{display:grid;grid-template-columns:90px 1fr;gap:6px;font-size:9px;align-items:center}.info-row .key{color:#65809d;display:flex;align-items:center;gap:6px}.info-row .value{font-weight:600;overflow:hidden;text-overflow:ellipsis}.info-sep{height:1px;background:#edf2f7;margin:3px 0}.live-text{height:360px;min-height:360px;width:100%;resize:none;border:0;outline:0;background:linear-gradient(180deg,#eef8ff,#fff);border-radius:6px;padding:13px;color:#31516f;font-size:11px;line-height:1.6}.live-text::placeholder{color:#98aac0}.text-time{text-align:right;font-size:8px;color:#6b849f;margin-top:-19px;padding-right:9px;position:relative}.status-box{display:grid;gap:10px}.status-line{display:flex;align-items:center;gap:8px;font-size:9px;font-weight:600}.status-dot{width:8px;height:8px;border-radius:50%;background:#16ae58;box-shadow:0 0 0 3px #e8faef}.status-dot.off{background:#e64949;box-shadow:0 0 0 3px #fff0f0}.signal{display:flex;align-items:flex-end;gap:3px;height:22px;margin-left:auto}.signal i{display:block;width:4px;background:#16b75b;border-radius:2px}.signal i:nth-child(1){height:7px}.signal i:nth-child(2){height:12px}.signal i:nth-child(3){height:17px}.signal i:nth-child(4){height:22px}.session-details{border-top:1px solid #edf2f7;margin-top:14px;padding-top:12px}.quick{border-top:1px solid #edf2f7;margin-top:14px;padding-top:12px}.quick .button{width:100%;height:32px;font-size:9px;margin-top:7px}.meta-empty{color:#8398af}.notice{display:none;margin-top:10px;padding:9px 10px;border:1px solid #f2c8c3;background:#fff3f2;color:#a52c26;border-radius:5px;font-size:9px}.notice.show{display:block}
/* settings */
.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.settings-card{padding:18px}.settings-card h3{margin:0 0 5px;font-size:12px}.settings-card p{margin:0;color:var(--muted);font-size:10px;line-height:1.6}.setting-value{margin-top:12px;padding:10px;background:#f7fbff;border:1px solid #e1edf7;border-radius:5px;font-size:10px;font-weight:700}
/* visitor */
.visitor-page{background:#f7f9fc;min-height:100vh;min-height:100dvh;overflow-x:hidden;position:relative}
.visitor-bg{position:fixed;inset:0;pointer-events:none;background:#f7f9fc}
.visitor-tower,.visitor-waves{display:none}
.visitor-header{height:64px;display:flex;justify-content:center;align-items:center;position:relative;z-index:2}
.visitor-logo{width:52px;height:52px}
.visitor-main{position:relative;z-index:1;width:100%;padding:clamp(24px,5vh,48px) 16px clamp(32px,8vh,72px)}
.visitor-intro{text-align:center}
.visitor-intro h1{font-size:clamp(22px,2vw,26px);letter-spacing:-.5px;margin:0 0 5px}
.visitor-intro p{font-size:12px;margin:0;color:#456582}
.visitor-card{width:min(100%,680px);margin:clamp(22px,4vh,34px) auto 0;background:#fff;border:1px solid #e1ebf5;border-radius:8px;padding:clamp(16px,2.5vw,24px);box-shadow:0 10px 24px rgba(39,79,116,.06)}
.visitor-card h2{font-size:14px;margin:0 0 4px}
.visitor-card .helper{font-size:9px;color:#738ba4;margin:0 0 18px}
.visitor-label{font-size:10px;font-weight:800;margin-bottom:8px;display:block}
.visitor-text{height:clamp(150px,32vh,340px);min-height:150px;width:100%;resize:none;border:1px solid #d9e5f0;border-radius:6px;padding:10px;font-size:11px;line-height:1.5;outline:none;color:#193957;background:#fff}
.visitor-text:focus{border-color:#76b4ee;box-shadow:0 0 0 3px rgba(8,122,242,.07)}
.count{text-align:right;color:#557493;font-size:8px;margin-top:5px}
.visitor-notice{display:none;margin-top:9px;padding:8px;background:#fff2f1;border:1px solid #f3c8c3;border-radius:5px;color:#a32a25;font-size:9px}
.visitor-notice.show{display:block}
.privacy-panel{width:min(100%,680px);margin:12px auto 0;background:#fff;border:1px solid #e0eaf4;border-radius:8px;padding:15px;display:none}
.privacy-panel h3{font-size:11px;margin:0 0 10px}
.privacy-item{font-size:9px;margin:7px 0;color:#234d74}
.privacy-item:before{content:"";display:inline-block;width:7px;height:7px;border:1.5px solid #1681e8;border-radius:2px;margin-right:8px}
.privacy-foot{border-top:1px solid #edf2f7;margin-top:12px;padding-top:10px;font-size:9px;color:#557493;line-height:1.5}
@media (max-width:899px){
  .visitor-header{height:58px}
  .visitor-main{padding:22px 12px 40px}
  .visitor-intro h1{font-size:22px}
  .visitor-card{width:100%;max-width:520px;margin-top:22px;padding:14px}
  .visitor-text{height:clamp(150px,34vh,260px);min-height:150px}
  .privacy-panel{width:100%;max-width:520px}
}
@media (min-width:900px){
  .visitor-main{padding-top:clamp(28px,6vh,64px)}
}
/* mobile owner */
@media (max-width:900px){.owner-shell{grid-template-columns:1fr}.sidebar{position:static;height:auto}.sidebar-brand{height:48px}.nav{display:flex;gap:4px;padding:6px 8px;overflow:auto}.nav a{margin:0;white-space:nowrap}.owner-header{display:none}.owner-main-body{padding:14px}.dash-grid{grid-template-columns:1fr}.live-text{height:300px;min-height:300px}.settings-grid,.url-grid{grid-template-columns:1fr}.dash-update{display:none}.dash-top{padding:0 12px}.dash-body{padding:10px 12px}.session-pill{max-width:130px;overflow:hidden;text-overflow:ellipsis}.login-shell{grid-template-columns:1fr;max-width:430px}.login-brand{min-height:220px;padding:35px 20px}.login-form{padding:34px 26px}.brand-foot{margin-top:30px}}
@media (max-width:520px){.visitor-main{padding-left:12px;padding-right:12px}.visitor-header{height:58px}.visitor-card{width:100%;padding:14px}.visitor-text{height:145px;min-height:145px}.sidebar-brand{padding-left:12px}.nav{padding-left:5px}.nav a{font-size:10px}.owner-main-body{padding:10px}.create-card{padding:16px}.dash-card{padding:12px}}

/* visitor writing box refinement */
.visitor-text{box-shadow:0 6px 16px rgba(39,79,116,.10),inset 0 1px 2px rgba(20,55,90,.03)}
@media (max-width:520px){
  .visitor-card{margin-bottom:24px}
  .visitor-text{height:clamp(180px,28vh,215px);min-height:180px;box-shadow:0 7px 18px rgba(39,79,116,.11),inset 0 1px 2px rgba(20,55,90,.03)}
}