:root { --ink:#32252a; --muted:#826f75; --mauve:#805465; --mauve-dark:#5e3948; --blush:#e9cdd0; --rose:#c58994; --cream:#fbf8f4; --paper:#fffdfb; --line:#eadfda; --sage:#64847a; --gold:#b48a52; --shadow:0 18px 45px rgba(93,55,67,.11); }
* { box-sizing:border-box; } body { margin:0; color:var(--ink); background:var(--cream); font:14px/1.5 "DM Sans",sans-serif; } button,input,select,textarea { font:inherit; } button { cursor:pointer; }
.login { min-height:100vh; display:grid; grid-template-columns:1.1fr .9fr; background:var(--paper); }
.login-art { background:radial-gradient(circle at 24% 20%,#f8e4dc 0 9%,transparent 9.3%),radial-gradient(circle at 69% 69%,#dbc2c7 0 13%,transparent 13.3%),linear-gradient(135deg,#835567,#4f3040); color:#fffaf7; padding:clamp(36px,8vw,110px); display:flex; flex-direction:column; justify-content:space-between; overflow:hidden; position:relative; }
.login-art:after { content:""; position:absolute; width:430px;height:430px;border:1px solid rgba(255,255,255,.22); border-radius:50%; right:-130px;bottom:-190px; }
.brand { display:flex;gap:11px;align-items:center;letter-spacing:.17em;font-size:11px;font-weight:700; } .lotus { width:37px;height:37px;position:relative;display:grid;place-items:center;flex:0 0 auto; } .lotus i { position:absolute;display:block;width:17px;height:28px;border:1.7px solid currentColor;border-radius:100% 0 100% 0;transform-origin:50% 100%; } .lotus i:nth-child(1){transform:rotate(0deg) translateY(-2px)} .lotus i:nth-child(2){transform:rotate(45deg) translateY(-1px)} .lotus i:nth-child(3){transform:rotate(90deg) translateY(-2px)} .lotus i:nth-child(4){transform:rotate(135deg) translateY(-1px)} .lotus i:nth-child(5){transform:rotate(180deg) translateY(-2px)} .lotus i:nth-child(6){transform:rotate(225deg) translateY(-1px)} .lotus i:nth-child(7){transform:rotate(270deg) translateY(-2px)} .lotus i:nth-child(8){transform:rotate(315deg) translateY(-1px)}
.login-art h1 { font:500 clamp(44px,5.7vw,80px)/1.08 "Playfair Display",serif; max-width:590px; position:relative;z-index:1; margin:55px 0; }.login-art p{max-width:370px;color:#f2dde0;font-size:16px}.login-form { display:flex;align-items:center;justify-content:center;padding:30px; }.login-card { width:min(390px,100%); }.eyebrow { color:var(--mauve);text-transform:uppercase;letter-spacing:.15em;font-size:11px;font-weight:700; }.login-card h2,.view-header h1 { font:500 35px/1.15 "Playfair Display",serif;margin:10px 0; }.login-card>p{color:var(--muted);margin:0 0 28px}.field{display:grid;gap:7px;margin:15px 0}.field label{font-size:12px;font-weight:700}.field input,.field select,.field textarea,.search { width:100%;border:1px solid var(--line);background:#fff;padding:12px 13px;border-radius:9px;outline:none; }.field input:focus,.search:focus{border-color:var(--mauve);box-shadow:0 0 0 3px #ead9de}.btn { border:0;border-radius:8px;padding:11px 16px;font-weight:700;transition:.18s; }.btn-primary{background:var(--mauve);color:#fff}.btn-primary:hover{background:var(--mauve-dark)}.btn-quiet{background:#f3e8e5;color:var(--mauve-dark)}.btn-line{background:transparent;border:1px solid var(--line);color:var(--mauve-dark)}.full{width:100%;margin-top:8px}.hint{margin-top:20px;padding:12px 13px;border-left:3px solid var(--blush);background:#fff8f6;color:var(--muted);font-size:12px}
.shell{min-height:100vh;display:grid;grid-template-columns:240px 1fr}.side{background:#fffdfb;border-right:1px solid var(--line);padding:27px 16px;display:flex;flex-direction:column}.side .brand{color:var(--mauve-dark);margin:0 10px 44px}.side .lotus{color:var(--mauve)}.nav{display:grid;gap:5px}.nav button{border:0;background:transparent;text-align:left;padding:11px 12px;border-radius:8px;color:var(--muted);font-weight:600}.nav button.active,.nav button:hover{background:#f4e8e8;color:var(--mauve-dark)}.nav button span{display:inline-block;width:24px;color:var(--rose)}.side-bottom{margin-top:auto;border-top:1px solid var(--line);padding:18px 10px 0}.user{display:flex;gap:10px;align-items:center}.avatar{display:grid;place-items:center;width:35px;height:35px;border-radius:50%;background:#ead1d1;color:var(--mauve-dark);font-weight:700}.user small{display:block;color:var(--muted)}.logout{margin-top:14px;padding:0;border:0;color:var(--muted);background:none;font-size:12px}
.content{padding:30px clamp(22px,4vw,57px);max-width:1560px;width:100%;margin:auto}.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px}.welcome{color:var(--muted)}.top-actions{display:flex;gap:10px;align-items:center}.date-pill{background:#fff;border:1px solid var(--line);padding:9px 12px;border-radius:7px;color:var(--muted);font-size:12px}.view-header{display:flex;justify-content:space-between;align-items:end;margin-bottom:25px}.view-header p{color:var(--muted);margin:7px 0 0}.stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stat{background:var(--paper);border:1px solid var(--line);padding:20px;border-radius:12px;box-shadow:0 4px 12px rgba(72,38,48,.025)}.stat label{color:var(--muted);font-size:12px}.stat strong{display:block;font:500 29px "Playfair Display",serif;margin:7px 0 2px}.stat small{color:var(--sage)}.stat small.warm{color:var(--gold)}
.grid-main{display:grid;grid-template-columns:1.3fr .7fr;gap:20px;margin-top:21px}.card{background:var(--paper);border:1px solid var(--line);border-radius:12px;padding:20px;box-shadow:0 4px 12px rgba(72,38,48,.025)}.card-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}.card h3{font:500 21px "Playfair Display",serif;margin:0}.text-btn{border:0;color:var(--mauve);background:none;font-weight:700;font-size:12px}.appointment{padding:14px 0;border-top:1px solid var(--line);display:grid;grid-template-columns:58px 1fr auto;align-items:center;gap:9px}.appointment:first-of-type{border-top:0}.appointment time{font-size:12px;color:var(--mauve);font-weight:700}.appointment b,.client-row b{display:block;font-size:13px}.appointment span,.client-row span{font-size:12px;color:var(--muted)}.tag{font-size:10px;font-weight:700;border-radius:20px;padding:5px 8px;background:#f1e4df;color:var(--mauve-dark);white-space:nowrap}.tag.green{background:#e2ede7;color:#467064}.agenda{display:grid;gap:12px}.agenda-item{padding:13px;background:#fbf5f2;border-radius:8px;border-left:3px solid var(--rose)}.agenda-item b{display:block}.agenda-item span{font-size:12px;color:var(--muted)}.quick{display:grid;grid-template-columns:1fr 1fr;gap:9px}.quick button{padding:13px 10px;border:1px solid var(--line);background:#fff;border-radius:8px;text-align:left;color:var(--mauve-dark);font-weight:700}.quick button span{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:3px}
.toolbar{display:flex;gap:12px;align-items:center;margin:0 0 17px}.search{max-width:360px;padding:10px 12px}.client-list{padding:0;overflow:hidden}.client-row{display:grid;grid-template-columns:44px 1.4fr 1fr 1fr 115px 28px;gap:14px;align-items:center;padding:15px 20px;border-top:1px solid var(--line);cursor:pointer}.client-row:hover{background:#fff8f6}.client-row.header{background:#fbf6f2;cursor:default;color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.08em;font-weight:700}.client-row.header:hover{background:#fbf6f2}.client-row .avatar{width:34px;height:34px;font-size:12px}.empty{padding:40px;text-align:center;color:var(--muted)}
.profile-layout{display:grid;grid-template-columns:290px 1fr;gap:20px}.identity{text-align:center}.identity .avatar{width:76px;height:76px;font-size:24px;margin:2px auto 13px}.identity h2{font:500 26px "Playfair Display";margin:0}.identity p{color:var(--muted);margin:3px}.profile-details{margin-top:25px;text-align:left;border-top:1px solid var(--line);padding-top:15px}.profile-details div{display:flex;justify-content:space-between;padding:7px 0;font-size:12px}.profile-details span{color:var(--muted)}.tabs{display:flex;gap:18px;border-bottom:1px solid var(--line);margin-bottom:19px}.tabs button{border:0;background:transparent;padding:10px 2px;color:var(--muted);font-weight:700}.tabs button.active{color:var(--mauve);border-bottom:2px solid var(--mauve)}.note{background:#fcf5f1;border:1px solid #f2e0d9;border-radius:8px;padding:14px;margin:10px 0}.note small{color:var(--muted)}
.calendar-card{padding:0;overflow:hidden}.calendar-top{padding:17px 20px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.calendar{display:grid;grid-template-columns:72px repeat(5,1fr);min-width:680px}.cal-scroll{overflow:auto}.cal-head{padding:12px;text-align:center;background:#fbf6f2;border-bottom:1px solid var(--line);font-size:12px;color:var(--muted)}.time-label{padding:20px 12px;color:var(--muted);font-size:11px;border-bottom:1px solid var(--line)}.slot{height:72px;border-bottom:1px solid var(--line);border-left:1px solid var(--line);padding:5px;position:relative}.event{font-size:11px;line-height:1.3;padding:6px;border-radius:5px;background:#f0d9dc;border-left:3px solid var(--rose);color:var(--mauve-dark);height:58px;overflow:hidden}.event.green{background:#dce9e3;border-color:#6f9c8d;color:#385d53}.event.gold{background:#f3e6d5;border-color:#c5975e;color:#78582d}
.service-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.service{position:relative}.service h3{margin:4px 0}.service p{color:var(--muted);font-size:12px;margin:0 0 14px}.service .price{font-weight:700;color:var(--mauve)}.service .duration{margin-left:10px;color:var(--muted);font-size:12px}.service .dots{position:absolute;right:13px;top:11px;background:none;border:0;color:var(--muted)}
.modal-backdrop{position:fixed;inset:0;background:rgba(48,29,38,.35);display:grid;place-items:center;padding:20px;z-index:3}.modal{width:min(510px,100%);max-height:90vh;overflow:auto;background:var(--paper);border-radius:13px;padding:25px;box-shadow:var(--shadow)}.modal h2{font:500 27px "Playfair Display";margin:0 0 5px}.modal p{margin-top:0;color:var(--muted)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:18px}.toast{position:fixed;bottom:22px;right:22px;background:var(--mauve-dark);color:white;padding:12px 16px;border-radius:8px;box-shadow:var(--shadow);z-index:4}
@media(max-width:900px){.stat-grid{grid-template-columns:repeat(2,1fr)}.grid-main,.profile-layout{grid-template-columns:1fr}.service-grid{grid-template-columns:repeat(2,1fr)}.client-row{grid-template-columns:42px 1.4fr 1fr 28px}.client-row>*:nth-child(4),.client-row>*:nth-child(5){display:none}}@media(max-width:650px){.login{grid-template-columns:1fr}.login-art{min-height:280px;padding:34px}.login-art h1{font-size:44px;margin:25px 0}.shell{grid-template-columns:1fr}.side{padding:17px 14px;border-right:0;border-bottom:1px solid var(--line)}.side .brand{margin:0 5px 14px}.nav{display:flex;overflow:auto}.nav button{white-space:nowrap}.side-bottom{display:none}.content{padding:22px 16px}.topbar{margin-bottom:20px}.top-actions .date-pill{display:none}.view-header{align-items:start;gap:15px}.view-header h1{font-size:29px}.stat-grid,.service-grid{grid-template-columns:1fr}.grid-main{margin-top:16px}.toolbar{flex-wrap:wrap}.client-row{padding:13px}.form-grid{grid-template-columns:1fr}}

/* Approved Lunaris Skin reference direction: light clinical canvas + wine-mauve studio rail. */
:root { --ink:#203456; --muted:#60708a; --mauve:#915d68; --mauve-dark:#6e414c; --blush:#e9c9ca; --rose:#bd6e77; --cream:#fdfbf9; --paper:#ffffff; --line:#e8e8ed; --sage:#49a796; --gold:#e79a46; --shadow:0 2px 10px rgba(39,51,78,.045); }
body { background:#fbfaf9; font-size:13px; }
.login { padding:11px; gap:11px; background:#fff; }
.login-art { border-radius:6px; background:linear-gradient(110deg,#fffdfb 0%,#f6e9e4 55%,#fffaf8 100%); color:var(--mauve-dark); padding:clamp(36px,6vw,86px); }
.login-art:before { content:""; position:absolute; width:270px; height:270px; left:-130px; top:-80px; border:1px solid #efd8d5; border-radius:50%; box-shadow:40px 20px 0 -39px #efd8d5,80px 40px 0 -79px #efd8d5; }
.login-art:after { border-color:#ecd8d5; right:-110px;bottom:-230px; }
.login-art .brand { color:#80505a; font-size:13px; letter-spacing:.32em; }
.login-art h1 { font-size:clamp(36px,4.6vw,65px); color:#754850; max-width:490px; }
.login-art p { color:#95656b; }.login-art small { color:#95656b; letter-spacing:.08em; }
.login-form { background:#fffaf8; border-radius:6px; }.login-card { width:min(345px,100%); }.login-card h2 { color:#5e3842; }
.login-card>p { font-size:12px; }.field input,.field select,.field textarea,.search { border-color:#e8e6e6; border-radius:7px; padding:11px 12px; }
.btn { border-radius:6px; font-size:12px; }.btn-primary { background:linear-gradient(90deg,#a66c72,#86515d); }.btn-quiet { background:#fff3f2; }.hint { font-size:10px; background:transparent; border:0; text-align:center; }
.shell { grid-template-columns:207px 1fr; background:#fff; }.side { padding:20px 10px; background:linear-gradient(160deg,#865661,#603d49); border:0; color:#fff; }
.side .brand { color:#fff; margin:0 13px 28px; flex-direction:column; gap:9px; text-align:center; font-family:"Playfair Display",serif; font-size:13px; letter-spacing:.23em; }.side .lotus { width:38px; height:32px; }
.nav { gap:3px; }.nav button { color:#fff5f4; padding:9px 12px; border-radius:5px; font-size:12px; }.nav button span { color:#fff; width:22px; }.nav button.active,.nav button:hover { background:rgba(245,203,203,.35); color:#fff; }
.side-bottom { border-color:rgba(255,255,255,.25); padding:15px 10px 0; }.side-bottom small,.logout { color:#f2dddf; }.avatar { background:#f0d4ce; color:#754650; }
.content { padding:0 25px 30px; max-width:none; }.topbar { height:53px; margin:0 -25px 12px; padding:0 25px; border-bottom:1px solid #ececf0; }.welcome { font-size:0; }.welcome:before { content:"Search clients, appointments, or services..."; font-size:11px; display:block; width:300px; padding:7px 14px; border-radius:7px; background:#f7f5f5; color:#778096; }.top-actions .btn { font-size:0; background:transparent; color:#915d68; padding:8px; }.top-actions .btn:before { content:"＋"; font-size:24px; }.date-pill { border:0; background:transparent; font-size:11px; color:#536784; }
.view-header { margin:10px 0 14px; }.view-header h1 { font:600 22px/1.1 "DM Sans",sans-serif; color:#172b4d; margin:7px 0 2px; }.view-header p { font-size:12px; margin:0; }.eyebrow { font-size:9px; letter-spacing:.12em; }
.stat-grid { gap:9px; }.stat { padding:14px 16px; border-radius:7px; box-shadow:none; }.stat label { font-size:10px; color:#405573; }.stat strong { font:600 25px "DM Sans",sans-serif; color:#172b4d; margin:3px 0; }.stat small { font-size:9px; }.grid-main { gap:10px; margin-top:11px; }.card { padding:14px; border-radius:7px; box-shadow:none; }.card-head { margin-bottom:8px; }.card h3 { font:600 14px "DM Sans",sans-serif; color:#203456; }.text-btn { font-size:10px; }
.appointment { grid-template-columns:58px 1fr auto; padding:10px 0; }.appointment time { font-size:10px; }.appointment b,.client-row b { color:#29405e; font-size:11px; }.appointment span,.client-row span { font-size:9px; }.tag { font-size:9px; padding:4px 7px; background:#e9effd; color:#3a78bb; }.tag.green { background:#d8f5ed; color:#268875; }.agenda { gap:7px; }.agenda-item { padding:10px; font-size:11px; }.agenda-item span { font-size:9px; }.quick { gap:7px; }.quick button { padding:10px 8px; border-radius:5px; font-size:10px; }.quick button span { font-size:9px; }
.toolbar { margin-bottom:10px; }.search { max-width:340px; font-size:11px; }.client-list { border-radius:7px; }.client-row { grid-template-columns:40px 1.5fr 1fr 1fr 95px 18px; padding:11px 14px; }.client-row.header { font-size:9px; }.client-row .avatar { width:30px; height:30px; font-size:10px; }
.profile-layout { grid-template-columns:300px 1fr; gap:12px; }.identity .avatar { width:72px; height:72px; }.identity h2 { font:600 18px "DM Sans",sans-serif; color:#172b4d; }.identity p { font-size:11px; }.profile-details div { font-size:11px; }.tabs { gap:23px; }.tabs button { font-size:10px; }.note { font-size:11px; }
.calendar-top { padding:13px 16px; font-size:11px; }.calendar { grid-template-columns:66px repeat(5,1fr); }.cal-head { font-size:10px; padding:10px; }.time-label { font-size:10px; padding:18px 9px; }.slot { height:65px; }.event { font-size:9px; height:54px; background:#cdeeea; border-left:0; color:#315c67; }.event.green { background:#cfe5fa; color:#315a86; }.event.gold { background:#e7d9fa; color:#5a4e88; }
.service-grid { gap:10px; }.service h3 { font:600 15px "DM Sans",sans-serif; }.service p { font-size:10px; }.service .price { font-size:12px; }.service .duration { font-size:10px; }
@media(max-width:650px){.shell{grid-template-columns:1fr}.side{padding:12px}.side .brand{display:none}.nav{display:flex}.content{padding:0 15px 20px}.topbar{margin:0 -15px 15px;padding:0 15px}.top-actions .date-pill{display:none}.welcome:before{width:190px}.profile-layout{grid-template-columns:1fr}.client-row{grid-template-columns:35px 1.5fr 1fr 16px}.stat-grid{grid-template-columns:1fr 1fr}}

/* Approved logo asset, derived from the provided Lunaris Skin reference. */
.lotus { background-image:url('assets/lunaris-skin-logo.png'); background-repeat:no-repeat; background-position:center 23%; background-size:92px auto; }
.lotus i { display:none; }
.v2-records { grid-column:2; background:#fff; border:1px solid var(--line); border-radius:7px; padding:16px; }
.v2-tabs { display:flex; gap:22px; border-bottom:1px solid var(--line); margin:-1px 0 16px; }
.v2-tabs button { border:0; background:transparent; padding:9px 2px; color:var(--muted); font-size:10px; font-weight:700; }
.v2-tabs button.active { color:var(--mauve); border-bottom:2px solid var(--mauve); }
.v2-section-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:13px; }
.v2-section-head h3 { color:#203456; font:600 14px "DM Sans",sans-serif; margin:4px 0 0; }
.clinical-alert { display:flex; gap:10px; align-items:flex-start; padding:11px 12px; border-radius:6px; background:#fff8f4; border:1px solid #f2e3da; color:#754a50; font-size:11px; }
.clinical-alert>span { color:#bd6e77; font-size:16px; }.clinical-alert p { margin:2px 0 0; color:#7a6c72; font-size:10px; }
.clinical-facts { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:12px 0 17px; }
.clinical-facts div { padding:10px; background:#fbfafb; border:1px solid var(--line); border-radius:5px; }.clinical-facts span { display:block; color:var(--muted); font-size:9px; margin-bottom:4px; }.clinical-facts b { color:#344866; font-size:10px; }
.v2-note-list { border-top:1px solid var(--line); padding-top:13px; }.clinical-note { display:grid; grid-template-columns:75px 1fr; gap:9px; padding:11px 0; border-top:1px solid #f0f0f2; }.clinical-note:first-of-type { border-top:0; }.note-date { color:#8a6570; font-size:10px; font-weight:700; }.clinical-note b { color:#304664; font-size:11px; }.clinical-note p { color:#5f6c82; font-size:10px; margin:3px 0; }.clinical-note small { color:#9aa2af; font-size:9px; }
.photo-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.photo-tile { overflow:hidden; border:1px solid var(--line); border-radius:6px; min-height:165px; background:#fff8f5; display:flex; flex-direction:column; justify-content:center; align-items:center; color:#a9777c; }.photo-tile.placeholder span { font-size:28px; }.photo-tile.placeholder b { font-size:11px; margin-top:7px; }.photo-tile.placeholder small { font-size:9px; color:#9e8d91; }.photo-tile.has-photo { position:relative; display:block; background:#f4efee; }.photo-tile.has-photo img { width:100%; height:142px; object-fit:cover; display:block; }.photo-tile.has-photo div { padding:7px 9px; background:#fff; }.photo-tile.has-photo b { display:block; color:#334863; font-size:10px; }.photo-tile.has-photo span { color:#8d97a4; font-size:9px; }
@media(max-width:900px){.v2-records{grid-column:1}.clinical-facts{grid-template-columns:1fr}.photo-grid{grid-template-columns:1fr 1fr}}@media(max-width:650px){.v2-section-head{align-items:flex-start}.v2-section-head .btn{white-space:nowrap}.photo-grid{grid-template-columns:1fr}.clinical-note{grid-template-columns:1fr;gap:3px}.v2-tabs{gap:14px}}

/* V3: forms and consent workspace */
.v3-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }.v3-template-section { padding:15px; background:#fff; border:1px solid var(--line); border-radius:7px; margin-bottom:12px; }.v3-template-section .card-head>span { color:var(--muted); font-size:10px; }.template-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }.template-card { position:relative; border:1px solid var(--line); border-radius:6px; padding:13px; min-height:195px; background:#fff; }.template-icon { width:29px; height:29px; display:grid; place-items:center; margin-bottom:10px; border-radius:5px; background:#fff2f0; color:#a2606a; font-size:17px; }.template-card h3 { color:#273d5d; font:600 12px/1.3 "DM Sans",sans-serif; margin:5px 0; }.template-card p { color:#647088; font-size:10px; line-height:1.45; margin:0; }.template-foot { position:absolute; right:12px; bottom:11px; left:12px; display:flex; align-items:center; justify-content:space-between; gap:7px; }.template-foot span { color:#9aa2ae; font-size:9px; }.v3-assignment-list { padding:14px 16px; }.form-row { display:grid; grid-template-columns:33px 1fr auto; align-items:center; gap:9px; padding:10px 0; border-top:1px solid #f0f0f2; }.form-row:first-of-type { border-top:0; }.form-round { display:grid; place-items:center; width:24px; height:24px; border-radius:50%; background:#f5e7e8; color:#a56069; font-size:11px; }.form-round.signed { background:#dcf3ec; color:#318d79; }.form-row b { display:block; color:#314662; font-size:11px; }.form-row span { display:block; color:#8490a0; font-size:9px; }.form-row>div:last-child { text-align:right; }.form-row small { display:block; color:#9ba3af; font-size:9px; margin-top:2px; }.v3-profile-forms { grid-column:2; padding:16px; background:#fff; border:1px solid var(--line); border-radius:7px; }.form-check { display:flex; align-items:flex-start; gap:8px; color:#617088; font-size:11px; margin-top:12px; }.form-check input { accent-color:var(--mauve); margin-top:2px; }.signature-preview { border-bottom:1px solid #ba8a92; padding:15px 10px 6px; margin:6px 0 15px; text-align:center; }.signature-preview span { font:italic 26px "Playfair Display",serif; color:#80505a; }.signature-preview small { display:block; color:#9da4ae; font-size:9px; margin-top:6px; }
@media(max-width:900px){.template-grid{grid-template-columns:repeat(2,1fr)}.v3-profile-forms{grid-column:1}}@media(max-width:650px){.v3-summary,.template-grid{grid-template-columns:1fr}.v3-profile-forms{padding:13px}.form-row{grid-template-columns:29px 1fr}.form-row>div:last-child{grid-column:2;text-align:left}.view-header>div:last-child{display:flex;gap:6px}.view-header>div:last-child .btn{padding:8px}}

/* V4: messages, aftercare, and follow-up management */
.v4-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }.message-workspace { display:grid; grid-template-columns:250px minmax(320px,1fr) 260px; min-height:410px; border:1px solid var(--line); border-radius:7px; overflow:hidden; background:#fff; }.inbox-panel { border-right:1px solid var(--line); }.inbox-head { display:flex; justify-content:space-between; align-items:center; padding:13px 14px; border-bottom:1px solid var(--line); color:#344967; font-size:12px; }.conversation { position:relative; width:100%; display:grid; grid-template-columns:31px 1fr auto; gap:8px; text-align:left; align-items:center; padding:11px 12px; border:0; border-bottom:1px solid #f1f1f3; background:#fff; }.conversation:hover,.conversation.active { background:#fff8f6; }.conversation .avatar { width:29px; height:29px; font-size:9px; }.conversation b { display:block; color:#304562; font-size:10px; }.conversation span { display:block; overflow:hidden; color:#7d899b; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }.conversation time { align-self:start; color:#9aa2ad; font-size:8px; }.conversation i { position:absolute; width:6px; height:6px; right:11px; bottom:12px; border-radius:50%; background:#b4626c; }.thread-panel { display:flex; min-width:0; flex-direction:column; }.thread-head { display:flex; align-items:center; gap:9px; padding:13px 15px; border-bottom:1px solid var(--line); }.thread-head .avatar { width:31px; height:31px; font-size:9px; }.thread-head b { display:block; color:#304562; font-size:11px; }.thread-head span { display:block; color:#8993a2; font-size:9px; }.thread-head .text-btn { margin-left:auto; }.thread-body { flex:1; display:flex; flex-direction:column; gap:9px; padding:17px; background:#fdfcfc; }.bubble { max-width:78%; border-radius:8px; padding:9px 11px; }.bubble p { margin:0; color:#46566e; font-size:10px; line-height:1.45; }.bubble small { display:block; margin-top:4px; color:#9da4ae; font-size:8px; }.bubble.outbound { align-self:flex-end; background:#f0dede; }.bubble.inbound { align-self:flex-start; border:1px solid #e7e9ec; background:#fff; }.message-compose { display:flex; gap:7px; padding:11px; border-top:1px solid var(--line); }.message-compose input { min-width:0; flex:1; border:1px solid var(--line); border-radius:5px; padding:9px; font-size:10px; outline:0; }.message-compose .btn { padding:8px 12px; }.followup-panel { padding:14px; background:#fff; border-left:1px solid var(--line); }.followup-row { display:grid; grid-template-columns:19px 1fr auto; gap:7px; align-items:start; padding:10px 0; border-top:1px solid #f0f0f2; }.followup-row:first-of-type { border-top:0; }.followup-check { width:17px; height:17px; padding:0; border:1px solid #c1cad3; border-radius:50%; background:#fff; color:#48a28f; font-size:11px; }.followup-row b { display:block; color:#3b506b; font-size:10px; }.followup-row span { display:block; color:#8f99a7; font-size:9px; }.followup-row time { color:#7c8795; font-size:9px; }.followup-row time.due { color:#b4626c; font-weight:700; }.aftercare-callout { width:100%; display:grid; gap:3px; margin-top:11px; padding:12px; text-align:left; border:1px solid #efdeda; border-radius:6px; background:#fff8f5; color:#a35d66; }.aftercare-callout span { font-size:16px; }.aftercare-callout b { font-size:10px; }.aftercare-callout small { color:#8f7a7d; font-size:9px; }.template-strip { margin-top:12px; padding:15px; border:1px solid var(--line); border-radius:7px; background:#fff; }.message-template-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.message-template { padding:11px; text-align:left; border:1px solid var(--line); border-radius:6px; background:#fff; }.message-template:hover { background:#fff8f6; }.message-template span { display:block; color:#a2606a; font-size:9px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }.message-template b { display:block; color:#344a68; font-size:11px; margin:4px 0; }.message-template small { display:-webkit-box; overflow:hidden; color:#8190a1; font-size:9px; line-height:1.4; -webkit-box-orient:vertical; -webkit-line-clamp:2; }.v4-profile-care { grid-column:2; padding:16px; border:1px solid var(--line); border-radius:7px; background:#fff; }.care-status { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0; }.care-status div { padding:9px; border:1px solid var(--line); border-radius:5px; background:#fbfafb; }.care-status span { display:block; color:#8a95a4; font-size:9px; }.care-status b { color:#3c506b; font-size:10px; }
@media(max-width:1050px){.message-workspace{grid-template-columns:210px minmax(280px,1fr)}.followup-panel{grid-column:1/-1;border-top:1px solid var(--line);border-left:0}.followup-panel .followup-row{display:inline-grid;width:32%;margin-right:1%}}@media(max-width:900px){.v4-profile-care{grid-column:1}}@media(max-width:650px){.v4-summary,.message-template-grid{grid-template-columns:1fr}.message-workspace{grid-template-columns:1fr}.inbox-panel{border-right:0;border-bottom:1px solid var(--line)}.conversation{display:none}.conversation.active{display:grid}.followup-panel .followup-row{display:grid;width:100%;margin:0}.thread-body{min-height:180px}.v4-profile-care{padding:13px}.care-status{grid-template-columns:1fr}.v4-profile-care .card-head{align-items:flex-start}.v4-profile-care .card-head>div:last-child{display:flex;gap:6px}.v4-profile-care .btn{padding:7px}}

/* V5: payment records, packages, and membership catalog */
.v5-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }.v5-transactions { padding:15px; }.transaction-head,.transaction-row { display:grid; grid-template-columns:1.5fr .7fr 1fr .55fr .55fr; gap:9px; align-items:center; }.transaction-head { padding:8px 0; color:#8c97a6; font-size:9px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; }.transaction-row { padding:10px 0; border-top:1px solid #f0f0f2; }.transaction-row b { color:#334a67; font-size:10px; }.transaction-row div b { display:block; }.transaction-row span { color:#8290a0; font-size:9px; }.transaction-row div span { display:block; }.finance-cards { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:12px; }.v5-catalog { padding:15px; border:1px solid var(--line); border-radius:7px; background:#fff; }.catalog-item { display:flex; justify-content:space-between; gap:10px; padding:11px 0; border-top:1px solid #f0f0f2; }.catalog-item:first-of-type { border-top:0; }.catalog-item b { display:block; color:#344b68; font-size:11px; }.catalog-item span { display:block; color:#a3626b; font-size:9px; }.catalog-item p { max-width:330px; margin:3px 0 0; color:#7e8b9d; font-size:9px; line-height:1.4; }.catalog-item strong { color:#80515d; font-size:11px; white-space:nowrap; }.finance-disclaimer { margin-top:12px; padding:10px 13px; border-left:3px solid #d59b66; background:#fff9ef; color:#856d58; font-size:10px; }.v5-profile-finance { grid-column:2; padding:16px; border:1px solid var(--line); border-radius:7px; background:#fff; }.finance-status { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin:10px 0; }.finance-status div { padding:9px; border:1px solid var(--line); border-radius:5px; background:#fbfafb; }.finance-status span { display:block; color:#8a95a4; font-size:9px; }.finance-status b { color:#3c506b; font-size:10px; }
@media(max-width:900px){.v5-profile-finance{grid-column:1}}@media(max-width:650px){.v5-summary,.finance-cards{grid-template-columns:1fr}.transaction-head{display:none}.transaction-row{grid-template-columns:1fr auto}.transaction-row>span:nth-child(2),.transaction-row>span:nth-child(3){display:none}.transaction-row .tag{grid-column:2}.v5-profile-finance{padding:13px}.finance-status{grid-template-columns:1fr}.v5-profile-finance .card-head{align-items:flex-start}.v5-profile-finance .card-head>div:last-child{display:flex;gap:6px}.v5-profile-finance .btn{padding:7px}}

/* V6: telehealth schedule, readiness checks, and virtual-room preview */
.v6-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-bottom:12px; }.telehealth-layout { display:grid; grid-template-columns:minmax(480px,1.35fr) minmax(280px,.65fr); gap:12px; }.v6-visit-list,.v6-readiness,.telehealth-template-section { padding:15px; border:1px solid var(--line); border-radius:7px; background:#fff; }.visit-row { display:grid; grid-template-columns:78px 31px 1fr auto auto; gap:9px; align-items:center; padding:12px 0; border-top:1px solid #f0f0f2; }.visit-row:first-of-type { border-top:0; }.visit-time b { display:block; color:#354b68; font-size:11px; }.visit-time span { color:#8e98a7; font-size:9px; }.visit-row .avatar { width:30px; height:30px; font-size:9px; }.visit-details b { display:block; color:#334a67; font-size:11px; }.visit-details span,.visit-details small { display:block; color:#8591a1; font-size:9px; }.visit-details small { color:#a0646d; }.visit-row .btn { padding:7px 9px; white-space:nowrap; }.v6-readiness h3 { margin:5px 0 10px; color:#344b68; font:600 14px "DM Sans",sans-serif; }.readiness-step { display:flex; gap:9px; padding:10px 0; border-top:1px solid #f0f0f2; }.readiness-step>span { display:grid; place-items:center; flex:0 0 auto; width:20px; height:20px; border:1px solid #c9d0d8; border-radius:50%; color:#8490a0; font-size:9px; }.readiness-step.complete>span { border-color:#b8e5db; background:#dcf4ec; color:#32907d; }.readiness-step b { display:block; color:#3e516c; font-size:10px; }.readiness-step small { display:block; color:#8994a3; font-size:9px; line-height:1.35; }.telehealth-note { margin-top:11px; padding:10px; border-left:3px solid #bd8389; background:#fff7f5; color:#806b71; font-size:9px; line-height:1.45; }.telehealth-template-section { margin-top:12px; }.telehealth-template-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; }.telehealth-template { display:flex; gap:9px; padding:11px; border:1px solid var(--line); border-radius:6px; }.telehealth-template>span { color:#a9656e; font-size:17px; }.telehealth-template b { display:block; color:#394e6a; font-size:10px; }.telehealth-template p { margin:3px 0 0; color:#8691a0; font-size:9px; line-height:1.4; }.v6-profile-telehealth { grid-column:2; padding:16px; border:1px solid var(--line); border-radius:7px; background:#fff; }.demo-room { display:flex; flex-direction:column; align-items:center; gap:5px; padding:24px; margin-bottom:13px; border-radius:8px; color:#fff; background:linear-gradient(135deg,#6f4654,#9b6971); }.room-avatar { display:grid; place-items:center; width:68px; height:68px; margin-bottom:5px; border:1px solid rgba(255,255,255,.4); border-radius:50%; background:rgba(255,255,255,.16); font-size:20px; }.demo-room>b { font-size:15px; }.demo-room>span { color:#f3dde0; font-size:10px; }.room-controls { display:flex; gap:9px; margin-top:14px; }.room-controls button { display:grid; gap:2px; place-items:center; width:48px; height:39px; border:1px solid rgba(255,255,255,.33); border-radius:6px; background:rgba(255,255,255,.1); color:#fff; }.room-controls small { font-size:8px; }
@media(max-width:900px){.telehealth-layout{grid-template-columns:1fr}.v6-profile-telehealth{grid-column:1}}@media(max-width:650px){.v6-summary,.telehealth-template-grid{grid-template-columns:1fr}.visit-row{grid-template-columns:55px 29px 1fr}.visit-row .tag,.visit-row .btn{grid-row:2}.visit-row .tag{grid-column:2}.visit-row .btn{grid-column:3;justify-self:start}.v6-profile-telehealth{padding:13px}.v6-profile-telehealth .card-head{align-items:flex-start}.v6-profile-telehealth .btn{padding:7px}}

/* V7: Payanywhere checkout context */
.payanywhere-status { display:flex; align-items:center; justify-content:space-between; gap:15px; margin:-2px 0 12px; padding:12px 14px; border:1px solid #eadbd2; border-radius:7px; background:linear-gradient(90deg,#fff9f5,#fff); }.payanywhere-status>div { display:flex; align-items:center; gap:10px; }.payanywhere-mark { display:grid; place-items:center; width:31px; height:31px; border-radius:7px; background:#844f59; color:#fff; font:600 18px "Playfair Display",serif; }.payanywhere-status b { display:block; color:#4c3c49; font-size:11px; }.payanywhere-status small { display:block; max-width:560px; color:#827882; font-size:9px; line-height:1.35; }.payanywhere-status .btn { white-space:nowrap; }
@media(max-width:650px){.payanywhere-status{align-items:flex-start;flex-direction:column}.payanywhere-status .btn{width:100%}}

/* V8: client and provider portal previews */
.portal-shell,.provider-shell { max-width:1080px; margin:0 auto; }.portal-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }.portal-brand { display:flex; align-items:center; gap:8px; color:#7e4b56; font:600 10px/1.15 "Playfair Display",serif; letter-spacing:.2em; }.portal-brand .lotus { width:29px; height:29px; background-size:76px auto; }.portal-back { border:0; background:transparent; color:#875864; font-size:10px; font-weight:700; }.portal-welcome { display:flex; align-items:end; justify-content:space-between; gap:18px; margin-bottom:18px; }.portal-welcome h1,.provider-top h1 { color:#2d405f; font:500 31px/1.15 "Playfair Display",serif; margin:6px 0; }.portal-welcome p,.provider-top p { margin:0; color:#778498; font-size:11px; }.portal-profile { display:flex; align-items:center; gap:8px; color:#8290a0; font-size:9px; }.portal-profile .avatar { width:34px; height:34px; font-size:10px; }.portal-hero { position:relative; display:flex; min-height:170px; justify-content:space-between; overflow:hidden; padding:25px; border-radius:10px; color:#fff; background:linear-gradient(118deg,#80505b,#b47a7d); }.portal-hero:after { position:absolute; right:-50px; bottom:-120px; width:260px; height:260px; border:1px solid rgba(255,255,255,.25); border-radius:50%; content:""; }.portal-hero>div:first-child { position:relative; z-index:1; }.portal-hero span { color:#f3dfe1; font-size:10px; }.portal-hero h2 { margin:7px 0; font:500 24px "Playfair Display",serif; }.portal-hero p { color:#fff1f1; font-size:10px; line-height:1.5; }.portal-hero .btn { margin-top:5px; background:#fff8f6; color:#7b4a55; }.portal-hero-mark { position:relative; z-index:1; align-self:center; padding-right:25px; color:#f5dcde; font-size:55px; }.portal-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; margin:12px 0; }.portal-card { padding:14px; text-align:left; border:1px solid var(--line); border-radius:7px; background:#fff; }.portal-card:hover { border-color:#ddbdbe; background:#fff9f8; }.portal-card>span { display:block; margin-bottom:7px; color:#a7656d; font-size:20px; }.portal-card b { display:block; color:#3b506d; font-size:11px; }.portal-card small { display:block; margin-top:2px; color:#8b97a6; font-size:9px; }.portal-columns { display:grid; grid-template-columns:1.45fr .55fr; gap:12px; }.portal-panel { padding:15px; border:1px solid var(--line); border-radius:7px; background:#fff; }.journey-row { display:grid; grid-template-columns:35px 1fr auto; align-items:center; gap:10px; padding:10px 0; border-top:1px solid #f0f0f2; }.journey-row>div { color:#8c6470; font-size:9px; text-align:center; }.journey-row>div b { display:block; color:#674653; font-size:14px; }.journey-row>span { color:#52647c; font-size:10px; }.portal-note { color:#718096; font-size:10px; line-height:1.5; }.portal-security,.provider-security { margin:15px 0 0; color:#9aa3ae; font-size:9px; text-align:center; }
.provider-top { display:flex; align-items:end; justify-content:space-between; gap:15px; margin-bottom:20px; }.provider-top>div:last-child { display:flex; gap:7px; }.provider-stats { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; margin-bottom:12px; }.provider-stats>div { padding:14px; border:1px solid var(--line); border-radius:7px; background:#fff; }.provider-stats span,.provider-stats small { display:block; color:#8290a0; font-size:9px; }.provider-stats b { display:block; margin:4px 0; color:#314764; font:600 23px "DM Sans",sans-serif; }.provider-stats small.warm { color:#b46c6e; }.provider-layout { display:grid; grid-template-columns:1.4fr .6fr; gap:12px; }.provider-schedule,.provider-readiness,.provider-tasks { padding:15px; border:1px solid var(--line); border-radius:7px; background:#fff; }.provider-visit { display:grid; grid-template-columns:58px 31px 1fr auto; align-items:center; gap:9px; padding:11px 0; border-top:1px solid #f0f0f2; }.provider-visit time { color:#895b65; font-size:10px; font-weight:700; }.provider-visit .avatar { width:30px; height:30px; font-size:9px; }.provider-visit b { display:block; color:#354a67; font-size:11px; }.provider-visit span,.provider-visit small { display:block; color:#8390a0; font-size:9px; }.provider-visit small { color:#a4656d; }.provider-visit .btn { padding:7px 8px; }.provider-readiness h3 { margin:5px 0 12px; color:#354a67; font:600 14px "DM Sans",sans-serif; }.provider-client { display:flex; align-items:center; gap:8px; padding-bottom:10px; border-bottom:1px solid #f0f0f2; }.provider-client .avatar { width:30px; height:30px; font-size:9px; }.provider-client b,.provider-client span { display:block; }.provider-client b { color:#354a67; font-size:10px; }.provider-client span { color:#8792a0; font-size:9px; }.provider-check { padding:9px 0; border-bottom:1px solid #f0f0f2; color:#788596; font-size:10px; }.provider-check.done { color:#3a9380; }.provider-tasks { margin-top:12px; }.provider-task-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }.provider-task-grid article { padding:12px; border:1px solid var(--line); border-radius:6px; }.provider-task-grid span { color:#b16c73; font-size:10px; font-weight:700; }.provider-task-grid b { display:block; margin:5px 0 2px; color:#3a506c; font-size:11px; }.provider-task-grid small { display:block; color:#8a96a6; font-size:9px; margin-bottom:7px; }
@media(max-width:900px){.portal-grid{grid-template-columns:repeat(2,1fr)}.portal-columns,.provider-layout{grid-template-columns:1fr}.provider-stats{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.portal-shell,.provider-shell{margin:0 -2px}.portal-top,.portal-welcome,.provider-top{align-items:flex-start;flex-direction:column}.portal-profile{align-self:flex-start}.portal-hero{padding:20px}.portal-hero h2{font-size:21px}.portal-grid,.portal-columns,.provider-stats,.provider-task-grid{grid-template-columns:1fr}.portal-hero-mark{display:none}.provider-top>div:last-child{width:100%}.provider-top .btn{flex:1;padding:8px}.provider-visit{grid-template-columns:52px 29px 1fr}.provider-visit .btn{grid-column:3;justify-self:start}.journey-row{grid-template-columns:32px 1fr}.journey-row .tag{grid-column:2;justify-self:start}}

/* Shared public-and-portal brand connection. The approved signature image remains the common photo asset. */
.portal-home { color:#875864; font-size:10px; font-weight:700; white-space:nowrap; }
.portal-hero { background:linear-gradient(90deg,rgba(112,67,77,.98),rgba(130,76,86,.89) 60%,rgba(166,107,113,.46)),url('assets/lunaris-login-reference.png') right center/auto 100% no-repeat; }

/* V9: video device test and Zoom readiness workspace */
.video-test-shell { max-width:1080px; margin:0 auto; }.video-test-grid { display:grid; grid-template-columns:1.35fr .65fr; gap:12px; }.video-preview-panel,.video-readiness-panel,.video-results { padding:16px; border:1px solid var(--line); border-radius:7px; background:#fff; }.video-stage { position:relative; display:grid; min-height:300px; overflow:hidden; place-items:center; border-radius:7px; background:linear-gradient(135deg,#503642,#93616c); }.video-stage video { width:100%; height:300px; object-fit:cover; }.video-placeholder { display:grid; position:absolute; place-items:center; gap:5px; padding:20px; color:#f7e9e9; text-align:center; }.video-placeholder span { font-size:48px; }.video-placeholder b { font:500 16px "Playfair Display",serif; }.video-placeholder small { color:#ead6d8; font-size:10px; }.video-chip { padding:4px 7px; border-radius:20px; background:#fff1e6; color:#b67436; font-size:9px; font-weight:700; }.video-chip.ready { background:#dff3ec; color:#318e7a; }.device-controls { display:flex; align-items:center; gap:8px; padding-top:11px; }.device-controls span { color:#8994a3; font-size:9px; }.video-readiness-panel h3 { margin:5px 0 12px; color:#334a67; font:600 14px "DM Sans",sans-serif; }.test-check { display:flex; gap:9px; padding:10px 0; border-top:1px solid #f0f0f2; }.test-check>span { display:grid; place-items:center; width:20px; height:20px; border:1px solid #c9d1da; border-radius:50%; color:#7b8898; font-size:9px; }.test-check.complete>span { border-color:#b8e5db; background:#dcf4ec; color:#33917e; }.test-check b { display:block; color:#3d526d; font-size:10px; }.test-check small { display:block; color:#8994a3; font-size:9px; line-height:1.35; }.video-results { margin-top:12px; }.test-result-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.test-result-grid div { padding:11px; border:1px solid var(--line); border-radius:6px; background:#fbfafb; }.test-result-grid span { display:block; color:#8995a3; font-size:9px; }.test-result-grid b { display:block; margin-top:3px; color:#3a506c; font-size:10px; }.video-results>p { margin:11px 0 0; color:#8592a2; font-size:9px; line-height:1.45; }.video-test-notes { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-top:12px; }.video-test-notes>div { padding:13px; border:1px solid var(--line); border-radius:7px; background:#fff; }.video-test-notes span { color:#ad6870; font-size:10px; font-weight:700; }.video-test-notes b { display:block; margin:5px 0 2px; color:#3b506b; font-size:11px; }.video-test-notes p { margin:0; color:#8995a4; font-size:9px; line-height:1.45; }
@media(max-width:900px){.video-test-grid{grid-template-columns:1fr}.test-result-grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:650px){.video-stage,.video-stage video{min-height:220px;height:220px}.device-controls{align-items:stretch;flex-direction:column}.device-controls .btn{width:100%}.test-result-grid,.video-test-notes{grid-template-columns:1fr}}

/* Approved login reference: a single, uncluttered Lunaris welcome card. */
.login { display:block; position:relative; width:min(220px,calc(100vw - 32px)); min-height:0; aspect-ratio:220/394; margin:min(8vh,56px) auto; padding:0; overflow:hidden; background:transparent; border:1px solid #eee6e3; border-radius:4px; box-shadow:0 12px 30px rgba(91,54,62,.12); }
.login-art { position:absolute; inset:0; min-height:0; padding:0; border-radius:0; background:#fff url('assets/lunaris-login-reference.png') center/100% 100% no-repeat; }
.login-art::before,.login-art::after,.login-art>* { display:none; }
.login-form { position:absolute; inset:0; display:block; padding:0; background:transparent; border-radius:0; pointer-events:none; }
.login-card { width:100%; height:100%; }.login-card>*:not(.btn-primary) { display:none; }
.login-card .btn-primary { position:absolute; z-index:2; top:62.5%; left:7.5%; width:85%; height:7.2%; margin:0; padding:0; opacity:0; pointer-events:auto; }
@media(max-width:650px){.login{width:min(220px,calc(100vw - 32px));margin:28px auto}.login-art{display:block}.login-form{display:block}.login-card h2{display:none}}