.reference-demo{margin:30px 0}.reference-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:20px;font-size:13px}.reference-controls select{font:inherit;padding:10px;min-height:44px;border:1px solid #ddd;border-radius:9px;background:#f5f5f7;max-width:100%}.reference-demo button{font:inherit;font-size:13px;border:0;border-radius:22px;padding:11px 18px;min-height:44px;cursor:pointer;background:#ededf1;color:#333}.reference-demo .primary{background:#007aff;color:#fff}.phone{position:relative;width:min(360px,100%);aspect-ratio:1180/2556;margin:0 auto;background:#080b0f;border-radius:44px;overflow:hidden;isolation:isolate;box-shadow:0 0 0 1px #181818,0 18px 40px #0001;color:white;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif}.neutral-home{position:absolute;inset:0;padding:100px 20px 0;background:radial-gradient(ellipse at 95% 85%,#2b4844,transparent 60%),radial-gradient(ellipse at 0% 20%,#75665e,transparent 70%),#171e2b}.home-widget{background:#fafafa;border-radius:23px;padding:18px;color:#007aff;font-size:15px;font-weight:600;min-height:106px}.home-widget span{display:block;color:#242424;font-weight:400;margin-top:14px;font-size:13px}.home-widget.secondary{margin-top:24px;min-height:124px;opacity:.35}.island{position:absolute;z-index:4;top:12px;left:50%;transform:translateX(-50%);width:108px;height:29px;border-radius:30px;background:#000;transition:opacity .3s}.siri-surface{position:absolute;top:10px;left:9px;right:9px;height:110px;padding:39px 20px 18px;border-radius:34px;background:linear-gradient(#000 65%,#121212df 82%,#fff8);box-shadow:inset 0 -1px 1px #fff9;transition:height .85s cubic-bezier(.23,1,.32,1),top .7s,left .7s,right .7s,border-radius .7s,background .6s;overflow:hidden}.phone[data-mode=expanded] .siri-surface,.phone[data-mode=confirm] .siri-surface,.phone[data-mode=result] .siri-surface{top:0;left:0;right:0;height:100%;border-radius:44px;background:linear-gradient(#000 70%,#000e 87%,#0008);box-shadow:none;padding:84px 22px 80px}.phone[data-mode=expanded] .island,.phone[data-mode=confirm] .island,.phone[data-mode=result] .island{opacity:0}.query{width:fit-content;max-width:87%;margin:0 0 49px auto;padding:8px 14px;background:#202022;border-radius:23px;font-size:15px;line-height:1.3;position:relative}.query:empty{display:none}.query:after{content:'';position:absolute;bottom:-4px;right:7px;width:10px;height:12px;background:#202022;clip-path:polygon(0 0,100% 0,100% 100%)}.article .answer{font-size:17px;line-height:1.24;letter-spacing:-.35px;margin:0 15px 25px}.phone[data-mode=compact] .answer,.phone[data-mode=ready] .answer{font-size:13px;margin:0;line-height:1.2;letter-spacing:-.1px}.result{background:#fff;border-radius:28px;padding:14px 15px 16px;color:#111;margin-top:26px;animation:result-in .55s ease-out}.result strong{display:block;color:#007aff;font-size:17px;letter-spacing:-.3px;font-weight:650;margin-bottom:9px}.result>div{display:flex;gap:10px;align-items:center;font-size:15px;line-height:1.35}.circle{width:19px;height:19px;border:1.5px solid #c6c6c8;border-radius:50%;flex-shrink:0}.confirmation{display:flex;gap:9px;margin-top:8px}.reference-demo .confirmation button{flex:1;background:#202024;color:#fff;font-size:15px;min-height:44px;padding:9px 12px}.reference-demo #update{background:#0095ff}.bottom-glow{position:absolute;pointer-events:none;bottom:-28px;height:57px;left:-30px;right:-30px;background:radial-gradient(ellipse at 50% 100%,#fff 10%,#fff 23%,#bde7ee 31%,#ead5e4 41%,transparent 65%);filter:blur(7px);opacity:0;transition:opacity .5s}.phone[data-mode=expanded] .bottom-glow,.phone[data-mode=confirm] .bottom-glow,.phone[data-mode=result] .bottom-glow{opacity:1}.home-line{position:absolute;bottom:8px;height:4px;width:100px;background:#fff;border-radius:3px;left:50%;transform:translateX(-50%)}.processing{position:absolute;top:6px;left:17px;width:24px;height:24px;display:none}.phone[data-mode=processing] .processing{display:block;animation:spin 1s linear infinite}.phone[data-mode=processing] .siri-surface{height:42px;padding:0;background:#000;left:50%;right:auto;width:160px;transform:translateX(-50%);border-radius:30px;box-shadow:0 6px 15px #0003}.phone[data-mode=processing] .island{opacity:0}.processing i{position:absolute;left:10px;top:1px;width:3px;height:3px;border-radius:50%;background:white;transform-origin:2px 11px;box-shadow:0 0 3px white}.processing i:nth-child(2){transform:rotate(60deg);opacity:.8}.processing i:nth-child(3){transform:rotate(120deg);opacity:.6}.processing i:nth-child(4){transform:rotate(180deg);opacity:.4}.processing i:nth-child(5){transform:rotate(240deg);opacity:.2}.processing i:nth-child(6){transform:rotate(300deg);opacity:.1}.article .reference-caption{font-size:13px;color:#707070;text-align:center;margin:22px 0 15px;min-height:44px}.reference-actions{display:flex;justify-content:center;gap:10px}.reference-demo button:disabled{opacity:.45;cursor:default}@keyframes spin{to{transform:rotate(360deg)}}@keyframes result-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:440px){.phone{border-radius:36px}.phone[data-mode=confirm] .siri-surface,.phone[data-mode=result] .siri-surface,.phone[data-mode=expanded] .siri-surface{border-radius:36px;padding-left:17px;padding-right:17px}.article .answer{font-size:16px;margin-left:10px;margin-right:10px}.query{font-size:14px}.result strong{font-size:16px}.result>div{font-size:14px}}@media(prefers-reduced-motion:reduce){.reference-demo *{animation:none!important;transition:none!important}}
.motion-review{background:#f6f6f8;border-radius:12px;padding:14px 16px;margin-bottom:22px;font-size:12px;display:grid;gap:9px}.motion-review>label:first-child{display:flex;justify-content:space-between}.motion-review input{width:100%;margin:0;min-height:28px;accent-color:#007aff}.motion-review select{font:inherit;border:1px solid #ddd;border-radius:6px;background:#fff;padding:6px 10px;margin-left:8px}.motion-review small{color:#707070}.motion-study .siri-surface{top:var(--surface-top);left:var(--surface-inset);right:var(--surface-inset);height:var(--surface-height);border-radius:var(--surface-radius);padding:var(--content-top) 20px 20px;background:linear-gradient(#000 75%,#000f 88%,#181b23d9 100%);transition:none;box-shadow:none}.motion-study .siri-surface:after{content:'';position:absolute;bottom:0;left:0;right:0;height:24px;background:linear-gradient(transparent,#ccc5);border-bottom:1px solid #fff9;opacity:var(--rim-opacity);pointer-events:none}.motion-study .answer{font-size:17px;margin:0 15px 25px;line-height:1.24}.motion-study .result{opacity:var(--card-opacity);transform:translateY(var(--card-y));animation:none}.motion-study .island{opacity:var(--island-opacity);transition:none}.motion-study .neutral-home:after{content:'';position:absolute;inset:0;background:#000;opacity:var(--backdrop-dim)}.motion-study .bottom-glow{opacity:var(--glow-opacity);transition:none}.motion-study .processing{display:none}@media(max-width:440px){.motion-study .answer{font-size:16px;margin-left:10px;margin-right:10px}}

/* Keep background color perceptible through the lower conversation glass. */
.phone[data-mode=expanded] .siri-surface,.phone[data-mode=confirm] .siri-surface,.phone[data-mode=result] .siri-surface{background:linear-gradient(#000 56%,#000f 65%,#000c 82%,#0003 100%);backdrop-filter:blur(22px) saturate(115%)}
.motion-study .siri-surface{background:linear-gradient(#000 56%,#000f 65%,#000c 82%,#0003 100%);backdrop-filter:blur(22px) saturate(115%)}
