#tetri-review { font: 14px/1.5 var(--font-helvetica-light, Arial), sans-serif; color: #f3f5f6; position: relative; z-index: 2147480000; }
#tetri-review *, #tetri-review *::before, #tetri-review *::after { box-sizing: border-box; }
#tetri-review .rn-toolbar { position: fixed; z-index: 2147480000; top: max(12px, env(safe-area-inset-top)); left: 50%; transform: translateX(-50%); display: flex; align-items: center; gap: 8px; padding: 7px; max-width: calc(100vw - 24px); border: 1px solid #81d8d0; border-radius: 30px; background: #071725f5; box-shadow: 0 5px 30px #0006; }
#tetri-review button, #tetri-review a { font: inherit; color: inherit; min-height: 44px; padding: 10px 16px; border: 1px solid #c6d0d644; border-radius: 24px; background: transparent; cursor: pointer; text-decoration: none; white-space: nowrap; }
#tetri-review button[aria-pressed=true], #tetri-review button[type=submit] { background: #81d8d0; color: #071725; border-color: #81d8d0; }
#tetri-review button:disabled { opacity: .6; cursor: wait; }
#tetri-review :focus-visible { outline: 2px solid #81d8d0; outline-offset: 4px; }
#tetri-review [hidden] { display: none !important; }
#tetri-review .rn-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
#tetri-review .rn-note { color: #f3f5f6; background: #071725; border: 1px solid #c6d0d666; border-radius: 18px; width: min(540px, calc(100% - 28px)); max-height: calc(100dvh - 32px); padding: clamp(20px, 5vw, 36px); overflow-y: auto; overscroll-behavior: contain; }
#tetri-review .rn-note::backdrop { background: #000b; backdrop-filter: blur(6px); }
#tetri-review .rn-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
#tetri-review .rn-label { color: #81d8d0; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; margin: 0; }
#tetri-review h2 { font-size: clamp(25px, 6vw, 38px); font-weight: 400; line-height: 1.1; margin: 12px 0 20px; }
#tetri-review .rn-context { color: #c6d0d6; font-size: 12px; overflow-wrap: anywhere; border-left: 2px solid #81d8d0; padding-left: 12px; margin: 0 0 24px; }
#tetri-review label { display: block; margin-bottom: 8px; }
#tetri-review textarea { display: block; width: 100%; resize: vertical; min-height: 130px; border: 1px solid #c6d0d666; background: #ffffff06; border-radius: 8px; padding: 14px; color: inherit; font: 16px/1.5 Arial, sans-serif; }
#tetri-review .rn-error { color: #ffb4b4; min-height: 1.5em; font-size: 13px; }
#tetri-review .rn-footnote { color: #c6d0d6; font-size: 11px; margin: 18px 0 0; }
#tetri-review .rn-footnote a { border: 0; padding: 4px 0; min-height: 32px; white-space: normal; color: #81d8d0; text-decoration: underline; }
#tetri-review .rn-pins { pointer-events: none; }
#tetri-review .rn-pin { position: fixed; z-index: 2147479999; width: 44px; height: 44px; padding: 0; pointer-events: auto; background: #81d8d0; border: 1px solid #071725; color: #071725; border-radius: 12px 12px 12px 0; box-shadow: 0 3px 12px #0006; font-weight: bold; }
.rn-picking body { cursor: crosshair !important; }
.rn-picking body :where(h1,h2,h3,p,img,video,figure,section,article):hover { outline: 1px dashed #81d8d0; outline-offset: 4px; }
@media(max-width: 420px) { #tetri-review .rn-toolbar { gap: 4px; } #tetri-review .rn-toolbar :where(button,a) { font-size: 11px; padding: 9px 11px; } }
#tetri-review .rn-menu { position:fixed; margin:0; width:min(260px,calc(100vw - 20px)); max-width:calc(100vw - 20px); padding:14px; border:1px solid #c6d0d655; border-radius:14px; background:#071725; color:#f3f5f6; box-shadow:0 16px 60px #0008; }
#tetri-review .rn-menu::backdrop { background:transparent; }
#tetri-review .rn-menu[open] { display:grid; gap:6px; }
#tetri-review .rn-menu .rn-label { padding:4px 8px 10px; }
#tetri-review .rn-menu :where(button,a) { text-align:left; border-color:transparent; white-space:normal; border-radius:8px; }
#tetri-review .rn-menu :where(button,a):hover { border-color:#81d8d066; background:#81d8d00c; }
#tetri-review .rn-note h2 { font-family:var(--font-gotham-thin,GothamThin,Arial),sans-serif; }
#tetri-review .rn-note :where(input,select) { font:inherit; color:inherit; }
#tetri-review .rn-note select { display:block; width:100%; min-height:44px; padding:10px 12px; background:#ffffff06; border:1px solid #c6d0d666; border-radius:8px; margin-top:6px; }
#tetri-review .rn-note option { background:#071725; color:#f3f5f6; }
#tetri-review .rn-note .rn-check { display:flex; align-items:start; gap:10px; font-size:12px; margin:16px 0; color:#c6d0d6; }
#tetri-review .rn-check input { appearance:auto; width:18px; height:18px; min-width:18px; margin:1px 0 0; accent-color:#81d8d0; }
#tetri-review .rn-project { margin-top:20px; }
#tetri-review [data-rn-record-info] { color:#c6d0d6; font-size:13px; }
#tetri-review .rn-file { color:#c6d0d6; font-size:12px; margin:18px 0; }
#tetri-review .rn-file input { display:block; max-width:100%; margin-top:8px; min-height:36px; font-size:12px; }
#tetri-review [data-rn-preview] { width:100%; max-height:260px; object-fit:contain; background:#000; border:1px solid #c6d0d644; margin:18px 0; border-radius:8px; }
#tetri-review .rn-recording-bar { position:fixed; z-index:2147480001; top:max(12px,env(safe-area-inset-top)); left:50%; transform:translateX(-50%); display:flex; align-items:center; gap:12px; max-width:calc(100vw - 20px); padding:7px 10px 7px 18px; border:1px solid #c6d0d666; border-radius:30px; background:#071725f5; font-size:12px; white-space:nowrap; }
#tetri-review .rn-recording-dot { width:7px; height:7px; border-radius:50%; background:#81d8d0; }
#tetri-review .rn-recording-bar button { min-height:36px; padding:7px 12px; font-size:12px; }
html[data-tetri-recording] #tetri-review .rn-toolbar { visibility:hidden; }
@media(max-width:420px) { #tetri-review .rn-toolbar { max-width:calc(100vw - 12px); } #tetri-review .rn-toolbar :where(button,a) { padding:8px; font-size:10px; min-height:38px; } }
@media(prefers-reduced-motion:no-preference) { #tetri-review .rn-recording-dot { animation:rn-recording 2s ease-in-out infinite; } @keyframes rn-recording { 50% { opacity:.4; } } }