/* Liquid Glass on the web: the floating control layer is separate from content. */
:root{color-scheme:light dark;--ink:#1d1d1f;--muted:#68686e;--canvas:#f5f5f7;--surface:#fff;--glass:rgba(255,255,255,.68);--edge:rgba(255,255,255,.85);--line:rgba(60,60,67,.12);--accent:#16854b;--accent-fill:#198a50;--wash:rgba(120,120,128,.1);--shadow:0 8px 28px rgba(30,40,50,.09),0 2px 5px rgba(30,40,50,.04);font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue","Noto Sans JP",sans-serif;color:var(--ink);background:var(--canvas);font-size:17px;-webkit-font-smoothing:antialiased}
body{background:radial-gradient(ellipse at 0 0,#dfeee8 0,transparent 45%),radial-gradient(ellipse at 100% 100%,#e2e9f5 0,transparent 50%),var(--canvas);gap:12px;padding:calc(12px + env(safe-area-inset-top)) calc(12px + env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));letter-spacing:-.025em}
button,a,input,select{-webkit-tap-highlight-color:transparent}button{touch-action:manipulation;font-weight:500}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}button:disabled{opacity:.4}input,select{color:var(--ink)}input::placeholder{color:var(--muted);opacity:1}
/* Specular rim, diffused shadow, and backdrop sampling form the glass material. */
aside,header,.toolbar,footer,.sidebar-bottom,dialog,#toast{background:var(--glass);-webkit-backdrop-filter:blur(28px) saturate(155%);backdrop-filter:blur(28px) saturate(155%);border:1px solid var(--edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -1px 0 rgba(255,255,255,.2),var(--shadow)}
aside{width:340px;border-radius:30px;position:relative;overflow:hidden}.list-heading{padding:28px 22px 20px;gap:12px}.eyebrow{font-size:12px;font-weight:600;letter-spacing:.02em;color:var(--muted)}h1{font-size:34px;letter-spacing:-.045em;font-weight:750;margin:5px 0 0;line-height:1.2}.add{width:48px;height:48px;border-radius:50%;font-size:30px;line-height:1;background:linear-gradient(150deg,rgba(255,255,255,.95),rgba(255,255,255,.3));color:var(--accent);border:1px solid var(--edge);box-shadow:inset 0 1px 1px #fff,0 3px 12px #18382b14;flex-shrink:0}
.group-search,.message-search{border-radius:100px;background:var(--wash);border:1px solid transparent;color:var(--muted);gap:9px}.group-search{margin:0 18px 22px;padding:0 15px}.group-search input,.message-search input{font-size:15px;min-height:44px;color:var(--ink);padding:0;letter-spacing:-.02em}.group-search:focus-within,.message-search:focus-within{border-color:var(--accent);background:var(--surface)}.list-label{font-size:12px;font-weight:600;color:var(--muted);padding:0 24px 10px}.list-label #group-count{background:var(--wash);border-radius:20px;min-width:24px;text-align:center;padding:2px 7px}
#groups{padding:0 10px 190px;scrollbar-width:thin;scroll-padding:12px}.group{border:0;border-radius:20px;padding:15px 12px;gap:12px;position:relative;margin-bottom:3px}.group::after{content:"";height:1px;background:var(--line);position:absolute;bottom:-2px;left:74px;right:12px}.group:hover{background:var(--wash)}.group.active{border:0;padding-left:12px;background:rgba(25,138,80,.12)}.avatar{width:52px;height:52px;border-radius:50%;font-size:21px;background:#dceee4;color:#327153}.group-title{font-size:16px;font-weight:650;letter-spacing:-.025em}.group-date{font-size:11px;color:var(--muted)}.preview{font-size:13px;color:var(--muted);line-height:1.5;margin:6px 0}.group-meta{font-size:11px;color:var(--muted)}.empty{font-size:14px;color:var(--muted);line-height:1.7;padding:40px 18px}.empty button{font-size:15px;color:var(--accent)}
.sidebar-bottom{position:absolute;bottom:12px;left:12px;right:12px;border-radius:24px;padding:8px 14px 12px;background:rgba(255,255,255,.78)}.sidebar-bottom>button{font-size:14px;color:var(--ink);width:100%;padding:0 10px;display:flex;align-items:center;gap:10px;border-radius:15px}.sidebar-bottom>button:hover{background:var(--wash)}.sidebar-bottom>button .symbol{width:21px;height:21px;color:var(--accent)}.sidebar-bottom span{font-size:11px;color:var(--muted);padding:4px 10px 0}.sidebar-bottom p{font-size:10px;color:var(--muted);padding:0 10px;margin:4px 0 0}
main{border-radius:30px;overflow:hidden;position:relative;background:rgba(255,255,255,.32)}.welcome{background:radial-gradient(ellipse at 50% 35%,rgba(217,237,227,.65),transparent 65%);padding:40px}.welcome-logo{width:88px;height:88px;border-radius:24px;box-shadow:0 15px 40px #2068451a,0 1px 2px #20684514;margin-bottom:30px}.welcome .eyebrow{font-size:13px;color:var(--muted)}.welcome h2{color:var(--ink);font-size:clamp(30px,3.2vw,46px);font-weight:720;line-height:1.35;letter-spacing:-.045em;margin:16px 0}.welcome p{font-size:15px;line-height:1.8;color:var(--muted);margin:8px 0}.welcome small{font-size:12px;color:var(--muted);margin-top:24px}.primary{background:var(--accent-fill);color:#fff;border-radius:100px;font-size:15px;min-height:48px;padding:12px 24px;font-weight:600;box-shadow:inset 0 1px 0 #ffffff35,0 4px 14px #16854b1f}.welcome .primary{display:flex;gap:8px;align-items:center;margin-top:24px}
#chat{position:relative;background:var(--canvas)}header{position:absolute;z-index:3;top:14px;left:16px;right:16px;min-height:76px;padding:12px 16px;gap:12px;border-radius:28px}.chat-avatar{width:44px;height:44px;min-height:44px;border-radius:50%;background:#dceee4;color:#327153}.chat-heading h2{font-size:17px;font-weight:650;letter-spacing:-.025em}.chat-heading p{font-size:12px;color:var(--muted);margin:5px 0 0}.chat-avatar:hover{outline:2px solid var(--accent)}.symbol{width:22px;height:22px;display:inline-block;vertical-align:middle;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.calendar-button{width:48px;height:48px;min-height:48px;border-radius:50%;justify-content:center;color:var(--ink);background:var(--wash)}.calendar-button .symbol{width:23px;height:23px}.toolbar{position:absolute;top:100px;left:16px;right:16px;z-index:2;min-height:58px;border-radius:25px;padding:7px 10px;gap:10px}.message-search{background:var(--wash);padding:0 12px}.message-search input{min-height:42px}#self{font-size:12px;color:var(--muted);max-width:145px;min-height:44px;border-radius:14px;background:transparent;padding:0 5px}#menu-button{width:44px;height:44px;flex-shrink:0;background:var(--wash);border-radius:50%;font-size:24px}#back{width:44px;height:44px;flex-shrink:0;border-radius:50%;color:var(--accent);padding:0;background:var(--wash)}#result{position:absolute;z-index:2;top:168px;left:50%;transform:translateX(-50%);max-width:90%;border-radius:20px;background:var(--surface);box-shadow:var(--shadow);padding:8px 16px;color:var(--muted);font-size:12px}
#messages{background:radial-gradient(ellipse at 5% 20%,#e8f1ed 0,transparent 65%),radial-gradient(ellipse at 95% 90%,#e5ebf5 0,transparent 70%),#f4f5f7;padding:184px max(24px,6%) 108px;scroll-padding:184px 0 108px}.date-label{background:var(--wash);color:var(--muted);font-size:12px;font-weight:550;padding:7px 14px;margin:6px auto 26px}.message{gap:10px;margin-bottom:22px}.message .avatar{width:32px;height:32px;background:#dae5df;color:#3d6652}.sender{font-size:12px;color:var(--muted);margin:0 0 6px 7px}.bubble{background:var(--surface);color:var(--ink);font-size:16px;line-height:1.65;padding:11px 16px;border-radius:21px 21px 21px 6px;box-shadow:0 1px 3px #152b3b09}.mine .bubble{background:var(--accent-fill);color:white;border-radius:21px 21px 6px 21px}.time{font-size:11px;color:var(--muted)}.system{font-size:12px;line-height:1.7;color:var(--muted)}footer{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 32px);border-radius:100px;padding:5px 8px 5px 17px;gap:18px;font-size:11px;color:var(--muted);z-index:3}footer button{font-size:13px;font-weight:600;color:var(--accent);border-radius:50px;background:var(--wash);padding:0 15px;white-space:nowrap}.load-more{background:var(--surface);color:var(--accent);font-size:13px;box-shadow:var(--shadow)}mark{background:#ffe39d;color:#222}
dialog{background:rgba(249,249,251,.88);border-radius:32px;color:var(--ink);padding:26px;max-height:calc(100dvh - 40px);overscroll-behavior:contain;scrollbar-width:thin}dialog::backdrop{background:rgba(20,24,30,.24);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.dialog-head{gap:12px;margin-bottom:12px}.dialog-head h2{font-size:22px;font-weight:700;letter-spacing:-.03em}.dialog-head button{width:44px;height:44px;flex-shrink:0;background:var(--wash);border-radius:50%;color:var(--muted);font-size:26px}dialog p,dialog li{font-size:14px;line-height:1.75;color:var(--muted)}dialog label{font-size:14px;color:var(--muted)}dialog input{font-size:16px;color:var(--ink);background:var(--surface);border:1px solid var(--line);border-radius:15px;padding:12px}.settings-section{background:var(--surface);border:1px solid var(--line);border-radius:22px;margin-top:16px;padding:18px}.settings-section h3{font-size:17px;letter-spacing:-.025em}.settings-section p{margin:8px 0 12px}.secondary{border:1px solid var(--line);border-radius:100px;background:var(--wash);color:var(--accent);font-size:14px;padding:10px 16px}.settings-actions{gap:9px}.settings-status{background:rgba(25,138,80,.1);color:var(--accent);border-radius:16px;font-size:14px}.drive-state{font-size:13px;color:var(--muted)}.drive-file{border-color:var(--line)}.drive-file strong{color:var(--ink);font-size:13px}.drive-file span{font-size:12px;color:var(--muted)}details,summary{font-size:13px}summary,dialog a{color:var(--accent)}dialog a{font-size:14px}dialog .origin{background:var(--wash);border-radius:12px}dialog code{font-size:12px}.menu-action{font-size:16px;border-color:var(--line);padding:15px 6px;min-height:52px}.danger{color:#c33732}.danger-filled{border-radius:100px;background:#c33732;color:#fff;font-size:14px}.month-nav strong{font-size:20px}.month-nav button{color:var(--accent);border-radius:50%;min-width:44px;min-height:44px}.month-nav button:hover{background:var(--wash)}.weekdays{font-size:13px;color:var(--muted)}#calendar-grid button,#calendar-grid .blank{height:48px;font-size:17px;border-radius:50%}#calendar-grid button.available::after{background:var(--accent)}#calendar-grid button.selected{background:var(--accent-fill);color:#fff}.calendar-edges{gap:5px;align-items:center}.calendar-edges button{font-size:12px;color:var(--accent);padding:0 5px;flex-shrink:0}.swipe-hint{font-size:10px;color:var(--muted);text-align:center}#toast{color:var(--ink);font-size:14px;border-radius:24px;padding:16px 22px;z-index:20}
@media(min-width:1100px){aside{width:360px}}
@media(max-width:759px){body{padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);background:var(--canvas)}aside{width:100%;height:100%;border:0;border-radius:0;background:radial-gradient(ellipse at 0 0,#e1eee7,transparent 70%),var(--canvas);box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none}.list-heading{padding:24px 22px 20px}.list-heading h1{font-size:36px}.group-search{margin:0 20px 24px}.group-search input{font-size:17px;min-height:46px}#groups{padding:0 10px 196px}.group{padding:16px 12px}.group.active{padding-left:12px}.group-title{font-size:17px}.group-date{font-size:12px}.preview{font-size:14px}.sidebar-bottom{bottom:12px;left:14px;right:14px;border-radius:28px;padding:8px 14px 12px}.sidebar-bottom>button{font-size:15px;min-height:44px}main{border-radius:0}header{top:10px;left:10px;right:10px;min-height:72px;padding:10px;gap:8px;border-radius:27px}.chat-heading h2{font-size:16px}.chat-heading p{font-size:11px}.chat-avatar{display:grid;width:36px;height:36px;min-height:36px}.calendar-button{width:44px;height:44px;min-height:44px}#back{display:grid;place-items:center;width:40px;height:44px}.toolbar{top:92px;left:10px;right:10px;padding:6px 8px;gap:6px;border-radius:24px;min-height:56px}#self{max-width:88px;font-size:11px}.message-search{gap:6px;padding:0 10px}.message-search input{font-size:16px;min-height:42px}#menu-button{width:40px;height:44px}#messages{padding:172px 14px 105px;scroll-padding:172px 0 105px}.message-body{max-width:80%}.bubble{font-size:16px;padding:10px 14px}.bubble-row{gap:5px}.time{font-size:10px}.message .avatar{width:28px;height:28px}.message{gap:7px}footer{bottom:14px;padding:5px 6px 5px 15px;gap:12px;max-width:calc(100% - 24px)}#result{top:155px}dialog{padding:22px;width:calc(100% - 24px);border-radius:30px;max-height:calc(100dvh - 32px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}.settings-dialog{width:calc(100% - 20px)}.settings-section{padding:16px}.dialog-head h2{font-size:21px}.settings-actions>.primary,.settings-actions>.secondary{flex:1 1 auto;justify-content:center;text-align:center}.calendar-edges .swipe-hint{max-width:130px}.welcome{padding:24px}}
@media(prefers-color-scheme:dark){:root{--ink:#f5f5f7;--muted:#aeaeb5;--canvas:#151618;--surface:#292b2f;--glass:rgba(40,42,46,.72);--edge:rgba(255,255,255,.15);--line:rgba(235,235,245,.13);--accent:#68d995;--accent-fill:#217f4c;--wash:rgba(180,180,190,.13);--shadow:0 8px 30px #0003}body{background:radial-gradient(ellipse at 0 0,#1e352b,transparent 55%),var(--canvas)}aside,header,.toolbar,footer,.sidebar-bottom,dialog,#toast{box-shadow:inset 0 1px 0 #ffffff12,var(--shadow)}.add{background:linear-gradient(145deg,#ffffff20,#ffffff05);box-shadow:inset 0 1px 0 #ffffff25,0 4px 12px #0002}.sidebar-bottom{background:rgba(40,42,46,.85)}main{background:#ffffff03}.welcome{background:radial-gradient(ellipse at 50% 35%,#21483455,transparent 65%)}.avatar,.chat-avatar{background:#294738;color:#a9dfbd}.message .avatar{background:#34493d;color:#c1dccb}.group.active{background:#5fd18b20}#messages{background:radial-gradient(ellipse at 0 20%,#20332b 0,transparent 70%),radial-gradient(ellipse at 100% 100%,#252e40 0,transparent 70%),#191c20}dialog{background:rgba(35,37,41,.92)}.danger{color:#ff817b}.danger-filled{background:#b73530;color:white}@media(max-width:759px){aside{background:radial-gradient(ellipse at 0 0,#20382c,transparent 70%),var(--canvas)}}}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){aside,header,.toolbar,footer,.sidebar-bottom,dialog,#toast{background:var(--surface)}}
@media(prefers-reduced-transparency:reduce){aside,header,.toolbar,footer,.sidebar-bottom,dialog,#toast{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(prefers-contrast:more){:root{--muted:var(--ink);--edge:var(--ink);--line:var(--ink)}aside,header,.toolbar,footer,.sidebar-bottom,dialog,#toast{background:var(--surface);-webkit-backdrop-filter:none;backdrop-filter:none}}
@media(prefers-reduced-motion:no-preference){button,a.secondary{transition:background .18s,transform .18s,box-shadow .18s}button:active:not(:disabled),a.secondary:active{transform:scale(.96)}dialog[open]{animation:glass-appear .24s cubic-bezier(.2,.8,.2,1)}@keyframes glass-appear{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
