.wallpaper-5{background:radial-gradient(ellipse at 95% 0,#e1f6ff,transparent 58%),radial-gradient(ellipse at 0 100%,#325678,transparent 60%),linear-gradient(135deg,#567c9d,#99c8d2)}.wallpaper-6{background:radial-gradient(ellipse at 0 0,#9571ff,transparent 55%),radial-gradient(ellipse at 100% 95%,#e1a0b4,transparent 60%),linear-gradient(110deg,#3d315a,#6c4e8d)}.wallpaper-7{background:radial-gradient(ellipse at 110% 60%,#f8d394 0,transparent 45%),radial-gradient(ellipse at 5% 30%,#cc8256,transparent 50%),linear-gradient(145deg,#573e3b,#c29062)}.wallpaper-8{background:radial-gradient(ellipse at 10% 0,#9dbea0,transparent 50%),radial-gradient(ellipse at 90% 110%,#c9cf9b,transparent 55%),linear-gradient(140deg,#1d3e38,#567665)}.wallpaper-9{background:radial-gradient(ellipse at 0 100%,#edaba9,transparent 60%),radial-gradient(ellipse at 100% 0,#7a5670,transparent 50%),linear-gradient(130deg,#593b5a,#b6788e)}.wallpaper-10{background:radial-gradient(ellipse at 110% 50%,#525765,transparent 50%),radial-gradient(ellipse at -10% 0,#424458,transparent 50%),linear-gradient(160deg,#14151a,#262833)}.wallpaper-11{background:radial-gradient(ellipse at 0 0,#69bdcc,transparent 60%),radial-gradient(ellipse at 100% 100%,#0f5568,transparent 60%),linear-gradient(120deg,#123d65,#357b88)}.wallpaper-12{background:radial-gradient(ellipse at 95% 0,#f3d1ba,transparent 50%),radial-gradient(ellipse at 0 100%,#a988ae,transparent 50%),linear-gradient(135deg,#d2918e,#c2a0ac)}
.phone{--accent:#3478ef;--on-accent:#fff;--ui-font:1;--home-columns:4}.phone .primary,.phone .send-button{background:var(--accent);color:var(--on-accent)}.phone .bubble.mine{background:var(--accent);color:var(--on-accent)}.phone .filter-tabs .active{background:var(--accent);color:var(--on-accent)}.phone .switch:checked{background:var(--accent)}.phone[data-contrast=true]{--muted:#545968;--line:#bdc1cd}.phone.dark[data-contrast=true]{--muted:#c0c4ce;--line:#595e6a}.phone[data-motion=false],.phone[data-motion=false] *{animation:none!important;transition:none!important;scroll-behavior:auto!important}
.phone .wallpaper{inset:-12px;background-size:cover;background-position:50% var(--wall-focus,50%);filter:blur(var(--wall-blur,0px));transform:scale(var(--wall-zoom,1))}.wallpaper:after{content:'';position:absolute;inset:0;background:#000;opacity:var(--wall-shade,.1)}.phone[data-frame=silver],.frame-silver{background:linear-gradient(110deg,#f0f0ee,#9a9da0 15%,#44474b 80%,#d9dde2)}.phone[data-frame=titanium],.frame-titanium{background:linear-gradient(110deg,#c8c2b8,#817a71 15%,#363632 80%,#b3ac9e)}.phone[data-frame=rose],.frame-rose{background:linear-gradient(110deg,#e3bfc3,#a77481 15%,#553942 80%,#dcacb1)}.phone[data-frame=ocean],.frame-ocean{background:linear-gradient(110deg,#96c0de,#4f799b 15%,#243b59 80%,#77a5c8)}.phone[data-frame=gold],.frame-gold{background:linear-gradient(110deg,#ead6ae,#a78955 15%,#5b4c35 80%,#d9bf88)}.frame-graphite{background:linear-gradient(110deg,#888b93,#262831 70%,#606574)}
body:not(.preview) .phone{bottom:var(--phone-bottom,12px)}body:not(.preview) .phone[data-side=left]{left:3vw;right:auto;transform-origin:bottom left}
.phone[data-clock=thin] .home-clock,.phone[data-clock=thin] .look-clock{font-weight:200;letter-spacing:-2px}.phone[data-clock=serif] .home-clock,.phone[data-clock=serif] .look-clock{font-family:Georgia,serif;font-weight:400;letter-spacing:-1px}.phone[data-clock=rounded] .home-clock,.phone[data-clock=rounded] .look-clock{font-family:'Arial Rounded MT Bold',system-ui,sans-serif;font-weight:800;letter-spacing:-2px}.phone .home-clock{white-space:nowrap;font-variant-numeric:tabular-nums}.phone[data-shape=square] .home-page .app-icon,.phone[data-shape=square] .look-mini-apps .app-icon{border-radius:9px!important}.phone[data-shape=circle] .home-page .app-icon,.phone[data-shape=circle] .look-mini-apps .app-icon{border-radius:50%!important}
.phone[data-icons=glass] .home-page .app-icon,.phone[data-icons=glass] .look-mini-apps .app-icon{background:#ffffff26!important;border:1px solid #ffffff50;box-shadow:inset 0 1px #ffffff40;color:white;backdrop-filter:blur(8px)}.phone[data-icons=mono] .home-page .app-icon,.phone[data-icons=mono] .look-mini-apps .app-icon{background:var(--accent)!important;color:var(--on-accent)}.phone[data-icons=outline] .home-page .app-icon,.phone[data-icons=outline] .look-mini-apps .app-icon{background:#16202b30!important;border:1px solid #ffffffb0;color:white;box-shadow:none}.phone[data-icons=mono] .home-page .external-icon{filter:grayscale(1)}
.phone .home-page .apps-grid{grid-template-columns:repeat(var(--home-columns),minmax(0,1fr));max-height:none;gap:16px 9px;padding:5px 2px 14px}.phone[data-icon-size=small] .apps-grid .app-icon{width:43px;height:43px}.phone[data-icon-size=large] .apps-grid .app-icon{width:59px;height:59px}.phone[data-labels=false] .home-page .app-icon-button>span:last-child:not(.app-icon){display:none}.home-page .home-pager{display:flex;align-items:center;justify-content:center;gap:12px;min-height:22px}.home-pager button{padding:3px;background:#ffffff17;color:#fff;border-radius:7px;display:grid;place-items:center}.home-pager button .icon{width:14px;height:14px}.home-page .home-widgets:has(>.widget:only-child){grid-template-columns:1fr}.home-page .dock{justify-content:space-evenly}.phone .row-copy strong{font-size:calc(13px * var(--ui-font))}.phone .row-copy small{font-size:calc(11px * var(--ui-font))}.phone .message-text,.phone .post-body{font-size:calc(13px * var(--ui-font))}.phone .field input,.phone .field textarea{font-size:calc(12px * var(--ui-font))}
.appearance-entry{width:100%;position:relative;display:flex;align-items:center;gap:15px;padding:22px 17px;margin:19px 0;border-radius:23px;color:var(--ink);background:linear-gradient(120deg,var(--card),var(--soft));border:1px solid var(--line);text-align:left;overflow:hidden}.appearance-entry small{font-size:8px;letter-spacing:1.1px;color:var(--muted)}.appearance-entry strong{display:block;font-size:21px;letter-spacing:-.7px;margin-top:6px}.appearance-entry p{font-size:10px;line-height:1.5;color:var(--muted);margin:6px 0 0}.appearance-entry>.icon{width:16px;margin-left:auto}.entry-art{display:flex;width:42px;flex-shrink:0;align-items:center;position:relative;height:75px}.entry-art i{position:absolute;width:30px;height:58px;border-radius:9px;border:1px solid #ffffff88;box-shadow:0 4px 12px #0001;background:linear-gradient(135deg,#979cf0,#e9a6a8)}.entry-art i:first-child{transform:rotate(-18deg);left:-7px;background:linear-gradient(135deg,#8db7a0,#426e67)}.entry-art i:last-child{transform:rotate(15deg);left:13px;background:linear-gradient(135deg,#dba98a,#bc8a99)}.ring-preview{padding:12px;color:var(--blue);background:none;display:flex;gap:8px;align-items:center;font-size:12px}.ring-preview .icon{width:18px}
.look-tabs{display:flex;padding:0 17px 12px;gap:4px}.look-tabs button{font-size:10px;flex:1;padding:10px 4px;border-radius:10px;background:var(--field);color:var(--muted)}.look-tabs button[aria-pressed=true]{background:var(--ink);color:var(--bg)}.look-page .look-scroll{padding:0 17px 22px}.look-preview{height:168px;border-radius:22px;color:white;position:relative;overflow:hidden;text-align:center;padding:17px 15px;isolation:isolate}.look-preview-wall{position:absolute;inset:0;z-index:-1;background-image:var(--wall-photo,none);background-size:cover;background-position:50% var(--wall-focus,50%);filter:blur(var(--wall-blur));transform:scale(var(--wall-zoom))}.look-preview:after{content:'';position:absolute;inset:0;background:#000;opacity:var(--preview-shade);z-index:-1}.look-preview>span{font-size:7px;letter-spacing:2px;opacity:.7}.look-preview>strong{display:block;font-size:34px;letter-spacing:-1.4px;margin:6px 0 12px;line-height:1}.look-preview>small{font-size:8px;opacity:.7;display:block;margin-top:11px}.look-mini-apps{display:flex;gap:9px;justify-content:center}.look-mini-apps .app-icon{width:29px;height:29px;border-radius:8px}.look-mini-apps .icon{width:16px;height:16px}.look-section{padding-top:23px}.look-section-heading{margin:0 1px 12px}.look-section h2{font-size:14px;letter-spacing:-.25px;margin:0}.look-section-heading p{font-size:10px;line-height:1.6;color:var(--muted);margin:6px 0 0}.look-segments{display:flex;gap:4px;background:var(--field);border-radius:11px;padding:4px;margin:10px 0}.look-segments button{flex:1;background:transparent;color:var(--muted);border-radius:8px;padding:9px 3px;font-size:10px}.look-segments button[aria-pressed=true]{background:var(--card);box-shadow:0 2px 6px #0001;color:var(--ink)}.look-presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 9px}.look-presets button{background:none;padding:0;color:var(--ink);text-align:left}.look-presets strong{font-size:10px;display:block;margin:7px 2px}.preset-sample{height:65px;display:flex;gap:5px;align-items:end;padding:12px;border-radius:13px}.preset-sample i{height:15px;width:15px;background:#ffffff50;border-radius:5px}.look-colors{display:flex;gap:9px;flex-wrap:wrap}.look-colors>button{width:29px;height:29px;border-radius:50%;border:2px solid transparent;background:var(--swatch);display:grid;place-items:center;color:#fff}.look-colors button[aria-pressed=true]{outline:2px solid var(--ink);outline-offset:3px}.look-colors .icon{width:16px}.custom-color{width:29px;height:29px;border:1px solid var(--line);border-radius:50%;position:relative;overflow:hidden;display:grid;place-items:center}.custom-color input{position:absolute;inset:0;opacity:0;width:100%;height:100%;cursor:pointer}.frame-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.frame-choices button{background:var(--card);border:1px solid var(--line);border-radius:13px;padding:12px 6px;color:var(--muted);font-size:9px;display:flex;align-items:center;flex-direction:column;gap:8px}.frame-choices button[aria-pressed=true]{border-color:var(--accent);color:var(--ink)}.frame-sample{width:24px;height:35px;display:block;border-radius:7px;position:relative}.frame-sample:after{content:'';position:absolute;inset:3px;background:#17181d;border-radius:4px}.look-wallpapers{display:grid;grid-template-columns:repeat(4,1fr);gap:11px 8px}.look-wallpapers button{background:none;padding:0;color:var(--muted)}.look-wallpapers button>span{height:87px;display:grid;place-items:center;border-radius:12px;border:2px solid transparent;color:#fff}.look-wallpapers button[aria-pressed=true]>span{outline:2px solid var(--accent);outline-offset:2px}.look-wallpapers small{font-size:8px;display:block;margin-top:7px}.look-photo{display:flex;align-items:center;gap:12px;background:var(--card);padding:15px;border-radius:14px;border:1px solid var(--line);width:100%;text-align:left;color:var(--blue)}.look-photo>span{flex:1}.look-photo strong{display:block;color:var(--ink);font-size:12px}.look-photo small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.look-range{display:block;background:var(--card);border:1px solid var(--line);border-radius:13px;padding:13px;margin:9px 0}.look-range>span{display:flex;justify-content:space-between;font-size:11px;margin-bottom:12px}.look-range output{font-variant-numeric:tabular-nums;color:var(--muted)}.look-range input{width:100%;accent-color:var(--accent)}.look-section .settings-row{padding:12px 2px}.look-section .settings-row select{max-width:145px}.look-section .field{margin-top:15px}.look-savebar{padding:9px 17px 14px;border-top:1px solid var(--line);background:var(--card);flex-shrink:0}.look-savebar>span{font-size:8px;color:var(--muted);display:block;margin-bottom:8px}.look-savebar>div{display:flex;gap:10px}.look-savebar button{font-size:11px;border-radius:11px;padding:11px 13px;color:var(--muted);background:var(--soft)}.look-savebar .primary{flex:1;background:var(--accent);color:var(--on-accent)}.look-reset{background:var(--soft);color:var(--muted);padding:13px;border:1px solid var(--line);border-radius:12px;width:100%;font-size:11px}.look-app-order{background:var(--card);border:1px solid var(--line);border-radius:14px;overflow:hidden}.look-app-row{display:flex;gap:8px;align-items:center;padding:10px;border-bottom:1px solid var(--line);cursor:grab}.look-app-row:last-child{border:0}.look-app-row .app-icon{width:28px;height:28px;border-radius:8px}.look-app-row .app-icon>.icon{width:17px;height:17px}.look-app-row>strong{flex:1;min-width:0;font-size:11px}.look-app-row button{width:25px;height:25px;background:var(--soft);border-radius:7px;color:var(--muted);display:grid;place-items:center}.look-app-row button .icon{width:14px;height:14px}.look-app-row button[aria-pressed=true]{color:var(--blue)}.look-dock-settings{display:grid;grid-template-columns:1fr 1fr;gap:9px}.look-dock-settings label{background:var(--card);border:1px solid var(--line);padding:11px;border-radius:12px;min-width:0}.look-dock-settings label>span{font-size:9px;color:var(--muted);display:block;margin-bottom:7px}.look-dock-settings select{width:100%;font-size:11px;padding:8px 3px;background:var(--soft);border:0;color:var(--ink);border-radius:7px}
/* Conversation gets its own scroll area; composer stays inside the screen. */
.page:has(.chat-scroll){min-height:0;overflow:hidden}.chat-scroll{flex:1;min-height:0;width:100%;overflow-y:auto;overflow-x:hidden;padding:14px 13px 18px;overscroll-behavior:contain;scrollbar-width:thin}.bubble{min-width:0;max-width:84%;flex-shrink:0}.bubble .media-placeholder{width:220px;max-width:100%}.bubble .message-text{display:block;word-break:break-word;overflow-wrap:anywhere}.bubble-time{white-space:normal;line-height:1.4}.compose{width:100%;min-width:0;flex-shrink:0;padding-bottom:12px}.compose-row{width:100%;min-width:0}.compose-row>.icon-button,.send-button{flex-shrink:0}.thread-subbar>span{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.backbar>strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}.chat-scroll .empty{flex-shrink:0}.compose textarea{height:38px;max-height:94px;overflow-y:auto}.compose .attachment-note{min-width:0;overflow-wrap:anywhere;font-size:10px}.compose .attachment-note button{flex-shrink:0}.messages-search{margin:0 18px 12px}.sending-note{font-size:9px;color:var(--muted);margin:0 0 7px;text-align:right}
.wallpaper-viewport{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}.look-tabs button{font-size:11px}.look-presets strong{font-size:11px}.look-savebar>span{font-size:10px}
